通过jquery ajax发送多个数据

Question

我正在构建一个表单来处理文本输入、多个复选框和 4 个图像。目前我将使用 each 函数处理复选框，以便在通过 ajax 发送之前将复选框的所有值放入一个数组中。现在的问题是我也不能用 ajax 发送图像。而且我也无法访问图像。

代码：

 $(document).ready(function () {
    //alert("this page works");
    $('#uploadProperty').on('submit',function  (e){
        e.preventDefault();

        var hname    = $('#hname').val();
        var location = $('#location').val();
        var htype    = $('#htype').val();
        var rooms    = $('#rooms').val();
        var price    = $('#price').val();
        var hdetails = $('#hdetails').val();
        var feature  = [];
        $('.feature').each(function() {
            if($(this).is(":checked")){
                feature.push($(this).val());
            }
        });
        // if (feature.length == 0)
        //  alert("Select atleast 1 Feature");
        // else{
        //  feature = feature.toString();
        //  alert(feature);
        // }
        var file1 = $('#file4').val();
        //alert(file1);
        $.ajax({
            url     : 'core/upload.php',
            type    : 'POST',
            data    : new FormData(),
            contentType : false,
            processData : false,
            success : function (ep){
                alert(ep);
            }
        });

    });
});

Answer 1

您需要先通过 ajax（例如：http://hayageek.com/docs/jquery-upload-file.php）上传图片，然后再为表单字段创建另一个 ajax。但是您需要在属性和图像之间建立一个 ID 链接。您可以添加一条空记录并记住 mysql_insert_id 以使用表单字段进行更新并插入图像或更新（取决于您的表结构如何）

Answer 2

所以如果我做对了，你想填充 FormData 对象。因为目前它是空的。 可以使用 append 方法：

    var formData = new FormData();
    var $myField = $('#myField');
    formData.append('myField', $myField.val());

要附加文件：

    var $fileField = $('#fileField');
    var myFile = $fileField.get(0).files[0];
    formData.append('myFile', myFile);

要附加乘法文件，您应该正确设置名称：

    formData.append('myFile[]', myFileFirst);
    formData.append('myFile[]', myFileSecond);

在这里查看：Uploading multiple files using formData()

另外，你可以通过构造函数获取整个表单数据：

    var form = $('form').get(0);
    var formData = new FormData(form);