Plusieurs pièces jointes à un formulaire

Question

J'ai un formulaire dans lequel je dois ajouter plusieurs pièces jointes. Cette fonctionnalité doit être dynamique, car l'utilisateur peut sélectionner autant de fichiers qu'il le souhaite et annuler l'un d'entre eux.

Sur le frontend, j'ai créé un élément d'entrée de fichier et lors de son "onchange", j'ajoute un autre élément d'entrée de fichier avec un identifiant et un nom différents. Le nom que j'utilise est "attachment []" car j'ai besoin d'envoyer les pièces jointes sous forme de tableau. Le bouton Envoyer invoque une fonction javascript lorsque j'utilise jquery pour obtenir les paramètres et créer une fiche de données. L'extrait de fonction est

function send() 
{ 
var form = document.getElementById("composeForm"); 

var formElements = form.elements; 
var formdata; 
for (x in formElements) 
{ 
    //each element that has type='file' and value is 0 is what we want to delete later 
    if(formElements[x].type=='file'&&formElements[x].value.length!=0) 
    { 
     console.log(document.getElementById(formElements[x].id).files[0]); 
    formdata = new FormData(); 
    var file = document.getElementById(formElements[x].id).files[0]; 
    formdata.append("attachment[]", file); 
    } 
} 

if (!formdata) 
{ 
    formdata = new FormData(); 
} 

formdata.append("subject", document.getElementById("subjectInput").value); 
if (formdata) { 
    $.ajax({ 
     url: "../ws/attach.php", 
     type: "POST", 
     data: formdata, 
     processData: false, 
     contentType: false, 
     success: function (res) { 
      alert(res); 
     } 
    }); 
} 

return false; 
} 

Mais le problème est que son envoi toujours le dernier fichier ajouté dans les paramètres. Le console.log inclus ci-dessus pour montrer tous les fichiers i.e.

File {webkitRelativePath: "", lastModifiedDate: Thu Dec 06 2012 03:01:55 GMT+0530 (India Standard Time), name: "backup.txt", type: "text/plain", size: 10584} 
File {webkitRelativePath: "", lastModifiedDate: Wed Dec 19 2012 16:24:36 GMT+0530 (India Standard Time), name: "acknowledgement.pdf", type: "application/pdf", size: 163435} 

Mais l'élément chrome inspecter montre que le seul paramètre envoyé a été

------WebKitFormBoundaryVYMwpCkBb8zK6tg0 
Content-Disposition: form-data; name="attachment[]"; filename="acknowledgement.pdf" 
Content-Type: application/pdf 

Y at-il me manque?

Answer 1

Eh bien c'est une erreur stupide que j'ai faite. L'erreur est due à l'initialisation FormData chaque fois :(

formdata = new FormData(); 

Merci à eux de toute façon qui a passé du temps là-dessus.