Объект JavaScript FormData не отправляется через jQuery

У меня есть следующая HTML-форма:

<form action="https://portal.    .com/index.php/ajax/do_add" method="post" accept-charset="utf-8" id="add_form" enctype="multipart/form-data"><div style="display:none">
 <input type="hidden" name="csrf_test_name" value="    " />
  <table id="table_add">        
   <tr>
    <td>Type:</td>
    <td><select name="type">
     <option value="blank"></option>
     <option value="document">Document</option>
     <option value="software">Software</option>
     <option value="video">Video</option>
    </select></td>
   </tr>

   <tr class="add_doc add_sw"><td>File:</td><td><input type="file" name="file" /></td></tr>
   <tr class="add_vid"><td>URL:</td><td><input type="text" name="url" value=""  /></td></tr>
   <tr class="add_doc"><td>Title:</td><td><input type="text" name="title" value=""  /></td></tr> 
    <!--OTHER ELEMENTS REMOVED FOR BREVITY -->
   <tr class="add_doc add_sw add_vid"><td colspan="2"><input type="submit" name="submit" value="Submit"  /></td></tr>
  </table>
 </form>

У меня есть следующий код jQuery (обратите внимание, что $ml равен $ по умолчанию):

$ml('form#add_form')
.submit(function(e){
    e.preventDefault();
    console.log($ml(this)); //outputs the form element context, as I was expecting
    var formdata = new FormData($ml(this));

    $ml.ajax({
        type: "POST",
        url: "/ajax/do_add",
        data: formdata,
        processData: false,
        contentType: false
    })
    .done(function(msg) {
        $ml('form#add_form').each(function(){ this.reset();});
        $ml('td#form_add_status').html('<span style="color:green;">Update complete</span>');
    })
    .fail(function(jqXHR, msg) {
        $ml('td#form_add_status').html('<span style="color:red;">Error Updating Entry: ' + msg + '</span>');
    })
 });

Без использования FormData и просто вручную передавая информацию формы, она работает - за исключением того, что у меня есть file тип input, Без AJAX форма работает нормально, с AJAX мне нужно FormData передать файл. Я просмотрел сеть и нашел несколько вещей, но ни одна из них не сработала.

Консоль разработчика показывает следующее при отправке:

Отладочная информация

1 ответ

Решение

Я не уверен на 100%, но, согласно документации, FormData принимает HTMLFormElement, который может быть неприемлемо заключен в объект jQuery ($ml(this)). Попробуйте пройти просто this?

Другой альтернативой является использование проверенного временем $(this).serialize() вместо того, чтобы вводить FormData,

Другие вопросы по тегам