2 Bilder in ein HTML-Formular hochladen

Question

Ich versuche, 2 Bilder als Teil eines HTML-Formulars hochzuladen. Im Moment ist mein PHP-Skript darauf angewiesen, dass der Name der Elemente gleich ist, damit ich den Code für beide Bilder wiederverwenden kann, ohne nur ein einziges Teil zu ändern.

upload.php:

<?php 
define("IMAGE_DIRECTORY", "images"); 

uploadFile("file"); 
uploadFile("file_1"); 

function uploadFile($name) { 
    //If the directory for images does not exist, create it 
    if(!is_dir(IMAGE_DIRECTORY)) { 
     mkdir(IMAGE_DIRECTORY, 0777, true); 
    } 

    var_dump(move_uploaded_file($_FILES[$name]["tmp_name"], IMAGE_DIRECTORY . "\\" .basename($_FILES[$name]["name"]))); 
} 
?> 

Mein HTML-Formular:

<form id="create_card_form" enctype="multipart/form-data" method="post"> 
    Front Text: <input type="text" name="front_text"><br><br> 
    Front Media (Image or Video Link) <input type="text" name="front_media"><br><br> 
    <input type='file' name='file' id='image_uploaded_front' accept='image'/><br><br> 
    Back Text: <input type="text" name="back_text"><br><br> 
    Back Media (Image or Video Link) <input type="text" name="back_media"><br><br> 
    <input type='file' name='file' id='image_uploaded_back' accept='image'/><br><br> 
    <input type="submit" value="CREATE CARD" onClick="createCard(this.form)"> 
</form> 

Ajax:

var form_data = new FormData(); 

var form_data_front = new FormData($('#create_card_form')[0]); 
var form_data_back = new FormData($('#create_card_form')[1]); 

form_data.append('file', form_data_front); 
form_data.append('file_1', form_data_back); 


$.ajax({ 
    url: "upload.php", 
    data : form_data, 
    type : "POST", 
    async: false, 
    cache: false, 
    contentType: false, 
    processData: false, 
    dateType : "html", 
}); 

Allerdings, wenn ich dieses Formular verwenden, das zweite Bild anstelle der genommen wird Das erste Bild, das ich annahm, ist, weil sie gleich benannt sind. Wenn Sie die Namen ändern, müssen Sie jedoch viel doppelten Code hinzufügen, um die Bilder zu verarbeiten. Gibt es eine Möglichkeit, dies mit dem gleichen Namen zu tun?

UPDATE: Ich habe mein Javascript und PHP-Skript basierend auf Antworten auf meine Frage bearbeitet. Nun scheint es das Problem, die Bilder korrekt zum PHP-Skript zu bekommen. Gerade jetzt, mit dem Code, den ich habe, gibt es einen Fehler beim Hochladen der Bilder in PHP.

Answer 1

Die Antwort auf Ihre Frage ist nein - Sie können nicht POST Eigenschaften mit dem gleichen Namen.

Die Lösung für Ihr Problem ist eigentlich genau das, was Sie erreichen wollen, nur nicht so, wie Sie es versuchen. Du willst keinen doppelten Code (was gut ist) - also setze Code, der mehr als einmal in einer Funktion ausgeführt werden muss.

<?php 

uploadFile("file"); 
uploadFile("secondFile"); 


function uploadFile($name) { 
    define("IMAGE_DIRECTORY", "images"); 

    //If the directory for images does not exist, create it 

    if(!is_dir(IMAGE_DIRECTORY)) { 
     mkdir(IMAGE_DIRECTORY, 0777, true); 
    } 

    var_dump(move_uploaded_file($_FILES[$name]["tmp_name"], IMAGE_DIRECTORY . "\\" .basename($_FILES[$name]["name"]))); 
} 
?> 

Edit: Gerade Alex Howansky getupft schlug mich auf die Antwort in einem Kommentar.