通過jQuery FORMDATA

Question

我想上傳使用jQuery文件提交表單。這裏的形式：

<form id="upload_data" class="project" enctype="multipart/form-data" method="POST"> 

<select id="project_id" name="project_id"> 
    <option value="1">1</option> 
    <option value="2">2</option> 
</select> 

<input type="file" id="data" name="data" /> 

<input type="hidden" name="user_id" id="user_id" value="12" required> 

<button type="submit" id="ajax" class="btn btn-primary">Submit</button> 
</form> 

這裏的jQuery的一部分：

$('#upload_data').submit(function(e) { 

     var form = $('form'); 
     var formData = new FormData(); 

       $.each($(':input', form), function(i, fileds){ 
        formData.append($(fileds).attr('name'), $(fileds).val()); 
       }); 

       $.each($('input[type=file]',form)[0].files, function (i, file) { 
        formData.append(file.name, file); 
       }); 

$.ajax({ 
     url: '../controllers/process.php', 
     type: 'POST', 
     enctype: 'multipart/form-data', 
     data: formData, 
     processData: false, 
     contentType: false, 
     success: function(data) 
     { 
      alert(data); 
     }, 
     error: function(data) 
     { 
      alert(data); 

     } 
    }); 

    }); 

的問題是，我在process.php漸漸空虛後的值：

if (isset($_POST['project_id']) AND isset($_POST['user_id'])){ 
    //process 
}else{ 
echo 'No post data'; 
} 

，它總是返回「不發佈數據「（但在控制檯中，我可以看到數據已發佈，但在服務器中並非如此）。我在這裏錯過了什麼？

Answer 1

您可以使用從阿賈克斯表格插件或jQuery的的給ajaxForm/ajaxSubmit的職能序列化功能。

jQuery AJAX submit form

和

How to send FormData objects with Ajax-requests in jQuery?

Answer 2

如果要附加一個文件FORMDATA

formData.append(file.name, file); 

您需要使用這個版本的方法按MDN文檔

formData.append(name, value, filename); 

，讓你呈現一個字段名，文件數據和文件名

你也可以考慮只submiting形式本身，而無需使用FORMDATA

Answer 3

謝謝所有您的回覆。問題是關於max_upload_filesize和post_max_size。我增加了這些選項的值，現在它正在工作。謝謝。