在ajax Jquery中发送多部分数据答案

【问题标题】：Send multipart-data in ajax Jquery在ajax Jquery中发送多部分数据
【发布时间】：2014-09-26 12:50:00
【问题描述】：

我的父窗口上有一个弹出窗口，pop-up 也有一个表单。该表单将有一些文件 input 类型。现在我想在 @987654323 的帮助下发送输入类型的数据@。我试过这个：

var formData = new FormData();
formData.append("file", $('#profileImg').get(0).files[0]);

但这对我不起作用。检查我的html 和jQuery：

HTML

<html xmlns="http://www.w3.org/1999/xhtml">
    <head>

    </head>

    <body>
        <div id="test" style="display:none;box-shadow: 1px 1px 5px; left: 50%; margin: -150px 0 0 -310px;  position: absolute; top: 50%; width: 600px;  z-index: 2;">
            <form name="add_user_form" method="post" enctype="multipart/form-data">
                Name: <input type="text" name="uname" id="uname"/><br/>
                Age:  <input type="text" name="age" id="age"/><br/>
                Profile Image: <input name="profileImg[]" type="file" id="profileImg"/><br />
                Display Image: <input name="displayImg[]" type="file" id="displayImg"/><br />
                <input type="submit" value="Submit" id="addUser"  name="addUser"/>
                <input type="reset" value="Reset" />
            </form>
        </div>

        <div id="list">
            <input type="button" id="addButton" value="Add"/>
        </div>
    </body>
</html>

jQuery

<script>
            $(document).ready( function() {
                $("#addButton").live('click',function(){
                    $("#test").show();
                });

                $("form[name=add_user_form]").live("submit", function(){
                    var formData = new FormData();
                    formData.append("file", $('#profileImg').get(0).files[0]);

                    alert(JSON.stringify(formData));
                      $.ajax({
                        url: 'bansal.html',
                        type: 'POST',
                        data: formData,
                        async: false,
                        cache: false,
                        //contentType: false,
                        processData: false,
                        success: function (returndata) {
                          alert(JSON.stringify(returndata));
                        }
                      });
                    return false; 
                });
            });

        </script>

建议我如何从 ajax 发送所有多部分数据

【问题讨论】：

真正的问题是什么？错误日志说什么，你的服务器端代码在哪里？

标签： javascript jquery html ajax multipartform-data

【解决方案1】：

用于多个文件输入

var formData = new FormData();
var files = $('[name="profileImg[]"]').get(0).files;
var len = files && files.length;
var i=0;
for(;i<len;i++)
   formData.append("file[]", $('#profileImg').get(0).files[i]);

【讨论】：

当我对此发出警告时，这在表单数据中也不起作用..{}。可能是什么问题
您试图提醒 formData 变量它不可能显示在浏览器网络面板上
@ManProgrammer 发布 jsFiddle 如果你可以我认为这也行不通

【解决方案2】：

您可以为此使用 Jquery ajaxForm (jquery.form.js)。

     $("#yourformid").ajaxForm()
     $("#yourformid").ajaxSubmit(function(response){
              alert('Success');
     });

<form enctype="multipart/form-data" action="Youraction URL">
      <input type="file" name="profileImg"/>
</form>

您可以发送任意数量的文件。

【讨论】：

@AjayBansal 如果您发现答案有帮助，那么您可以接受我的答案 :)