FormDataはキャッチされない型エラーを返します

Question

jQueryを使用してAJAXからフォームを送信しています。私はこれを取得しかし

$("#myForm-form").on("submit", function(event) { 
    event.preventDefault(); 
    var formData = new FormData($(this)[0]); 
    $.ajax({ 
     url: $(this).attr('action'), 
     type: $(this).attr('method'), 
     data: { 
      'eoss': 'indexEOSS', 
      'form': 'myForm', 
      'values': createJSON(), 
      'formData': formData 
     }, 
     success: function(data) { 
      console.log(data); 
      eval(data); 
      myFormForm(data); 
     }, 
     processData: false, 
     contentType: false 
    }); 
    return false 
}); 

：私は、次のコードを持っている

GET http://localhost/EOSS2/request.php?[object%20Object] 404 (Not Found)

私はprocessData: falseとcontentType: falseを削除すると、私は次のエラーを取得する：

Uncaught TypeError: Illegal invocation

私は何をすべき？

Answer 1

ここには2つの問題があります。まず、エラーメッセージは、FormDataで動作しないGET要求を送信していることを示しています。この場合、POSTを使用するのが最も適しているようです。

第2に、オブジェクトにFormDataを送信することはできません。これは、jQueryがURLエンコードを試みて問題につながるためです。代わりにappend()メソッドを使用してFormDataオブジェクトに情報を追加します。試してみてください：

$("#myForm-form").on("submit", function(e) { 
    e.preventDefault(); 

    var $form = $(this); 
    var formData = new FormData($form[0]); 
    formData.append('eoss', 'indexEOSS'); 
    formData.append('form', 'myForm'); 
    formData.append('values', createJSON()); 

    $.ajax({ 
     url: $form.attr('action'), 
     type: $form.attr('method'), // change the attribute in HTML or hardcode to 'post' 
     data: formData, 
     success: function(data) { 
      console.log(data); 
      // eval(data); < never, ever use eval() 
      myFormForm(data); 
     }, 
     processData: false, 
     contentType: false 
    }); 
});