web-dev-qa-db-fra.com

La soumission d'un fichier avec jQuery.ajax donne TypeError

J'essaie de soumettre un fichier à partir d'un formulaire à l'aide de la méthode ajax de jQuery:

var ofile=document.getElementById('image').files[0];
var formdata = new FormData();
formdata.append("image",ofile);

$.ajax({
    url:'elements/save_elements',
    data:formdata,
    type:'POST'
});

Cela entraîne l'erreur TypeError: 'append' called on an object that does not implement interface FormData.

Qu'est-ce qui cause cette erreur? Cela ne se produit pas sur le formdata.append, mais dans jQuery.

javascriptjqueryapiform-data
17
user2889070

J'avais le même problème avec un code similaire. Il y a une grave pénurie d'informations sur cette erreur, aussi, puisque le PO n'a pas précisé:

Avec un peu de débogage, j'ai réalisé que l'erreur était générée par l'appel ajax dans les profondeurs de jquery, pas par l'ajout réel. Il s'avère que j'avais oublié d'ajouter processData: false, contentType: false à la demande ajax; Cela a résolu le problème.

99
Bhau

Cela fonctionne bien lorsque vous ajoutez les éléments suivants à l'objet ajax:

contentType: false,
processData: false,

Donc, cela devrait ressembler à:

$.ajax({
    url:'elements/save_elements',
    data:formdata,
    type:'POST',
    contentType: false,
    processData: false,
});
1
Canaan Etai

L'ajout de ces paramètres à ajax résout le problème

$.ajax({
      url: 'upload_ajax.php',
       type: 'POST',
       data: formData,
       contentType: false,
       processData: false,
0
Radhika Choudhary