formData объект не работает с jquery AJAX post?

Question

позволяет прыгать прямо в код:

var formData = new FormData(); 

formData.append('name', dogName); 
formData.append('weight', dogWeight); 
formData.append('activity', dogActivity); 
formData.append('age', dogAge); 
formData.append('file', document.getElementById("dogImg").files[0]); 
console.log(formData); 

Вот я, добавляя некоторые строки и объект один файл в объект FormData для того, чтобы отправить всю информацию асинхронной к серверу.

Сразу после этого у меня есть этот запрос JQuery Ajax:

$.ajax({ 
    type: "POST", 
    url: "/foodoo/index.php?method=insertNewDog", 
    data: formData, 
    processData: false, 
    contentType: false, 
    success: function(response){ 
    console.log(response); 
    }, 
    error: function(){ 
    } 
}); 

Так вот я выкладываю информацию на сервер, на файловом сервере PHP У меня есть простой print_r в POST, так что я вижу что проходит, а что нет.

К сожалению, мой ответ в console.log (данные) пуст.

Кроме того, если вы проверяете HEADER на вкладке Network вы получите следующий результат: пустой

функция Успех будет вызываться (только для осветления)

Answer 1

Когда вы отправляете в Ajax запросить через jQuery, и вы хотите отправить FormData, вам не нужно использовать JSON.stringify в этом FormData. Кроме того, когда вы отправляете файл типа содержимого должен быть multipart/form-data включая boundry - что-то вроде этого multipart/form-data; boundary=----WebKitFormBoundary0BPm0koKA

Так отправить FormData в том числе некоторых файлов с помощью JQuery AJAX вам нужно:

• Установите data в FormData без любые изменения.
• processData - false (Позволяет запретить jQuery автоматически преобразовывать данные в строку запроса).
• Установите contentType на номер false (Это необходимо, поскольку в противном случае jQuery установит его неправильно).

Ваш запрос должен выглядеть следующим образом:

var formData = new FormData(); 

formData.append('name', dogName); 
// ... 
formData.append('file', document.getElementById("dogImg").files[0]); 


$.ajax({ 
    type: "POST", 
    url: "/foodoo/index.php?method=insertNewDog", 
    data: formData, 
    processData: false, 
    contentType: false, 
    success: function(response) { 
     console.log(response); 
    }, 
    error: function(errResponse) { 
     console.log(errResponse); 
    } 
}); 

Answer 2

если вы сделали именно так, как проницаемый anwswer и до сих пор не работает не переживайте its working

возможно intelligence and quick wath говорят вам его not working

, но не волнуйтесь, посмотрите на network tap

его рабочим

надеюсь, что это экономит ваше время

Answer 3

//For those who use plain javascript 

var form = document.getElementById('registration-form'); //id of form 
var formdata = new FormData(form); 
var xhr = new XMLHttpRequest(); 
xhr.open('POST','form.php',true); 
// xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded'); 
//if you have included the setRequestHeader remove that line as you need the 
// multipart/form-data as content type. 
xhr.onload = function(){ 
console.log(xhr.responseText); 
} 
xhr.send(formdata);