Как загрузить файл для Ajax

Question

Я пытаюсь отправить форму через ajax, у которой есть некоторые изображения. Следующий код возвращает объект (в console.form), «FormData», однако как его использовать и извлекать, и правильно ли это.

$("#form_galeria").unbind('submit').bind('submit', function(e) { 
    e.preventDefault(); 
    var url = 'salvarGaleria.do'; 

    var form; 
    form = new FormData(); 

    form.append('fileUpload', e.target.files); 
    console.log(form); 

    $.ajax({ 
     type: "POST", 
     url: url, 
     data: $("#form_galeria").serialize(), 
     processData: false, 
     contentType: false, 
     success: function(result) { 
      console.log(result); 
     }, 
     error: function(err) { 
      console.log(err.status + ' - ' + err.statusText); 
     } 
    }); 

    $('#multiplas').modal('hide'); 
    return false; 
}); 

Answer 1

Установите параметр Аякса data к вашему FormData объекта. Вам нужно будет добавить любые значения поля для объекта FormData, если вы хотите отправить их вместе с загрузкой файла. Также вам необходимо добавить каждый отдельный файл, который вы не можете просто добавить в комплект e.target.files

for(var i=0; i<e.target.files.length; i++){ 
    form.append("fileUpload[]",e.target.files[i]); 
} 
//or if you are only doing a single file 
//form.append("fileUpload",e.target.files[0]); 

form.append("someField",jQuery("#someField").val()); 
form.append("someOtherField",jQuery("#someOtherField").val()); 

$.ajax({ 
    type: "POST", 
    url: url, 
    data: form, 
    processData: false, 
    contentType: false, 
    success: function(result){ 
     console.log(result); 
    }, 
    error: function(err){ 
     console.log(err.status + ' - ' + err.statusText); 
    } 
});