将FormData对象放入数组中，以从不同的输入文件中上载文件

Question

我有一张这样的表格：

<form>

    <div class="characteristicData" id="1">
        <textarea></textarea>
        <input type="file" name="filelist-1" />
    </div>

    <div class="characteristicData" id="2">
            <textarea></textarea>
            <input type="file" name="filelist-2" />
    </div>

    <input type="button" class="send" value="Send" />

</form>

此表单包含三个div，用于区分正确将其发送到服务器所需的数据，并在DB中为归属的id设置正确的值。

我想在服务器上为$_POST和$_FILES获取的数据如下所示：

$_POST

Array
(
    [characteristic] => Array
    (
        [element_0] => Array
        (
            [id_characteristic] => 1
            [items] => 0001,0002,0003
        )

        [element_1] => Array
        (
            [id_characteristic] => ="2"
            [items] => 0001,0002,0003
        )

     )

 )

$_FILES

Array
(
    [characteristic] => Array
    (
        [element_0] => Array
        (
            [name] => items.csv
            [type] => application/vnd.ms-excel
            [tmp_name] => tmp/php44DF.tmp
            [error] => 0
            [size] => 8
        )
        [element_1] => Array
        (
            [name] => items.csv
            [type] => application/vnd.ms-excel
            [tmp_name] => tmp/php44DF.tmp
            [error] => 0
            [size] => 8
        )
    )
)

因此，我的选项是尝试创建一个包含键和每个键包含FormData对象的对象。最后，我的jQuery是：

$(function() {

    $(".send").click(function() {

        var formdata = new FormData(),
            $this,
            fileDOM = $("input[type='file']")[0];

        $(".characteristicData").each(function(i, v) {

            $this = $(this);
            fileDOM = $this.find("input[type='file']")[0];

            formdata.append("characteristic[element_"+i+"][id_characteristic]", $this.attr("id"));
            formdata.append("characteristic[element_"+i+"][items]", $this.find("textarea").val());

            if ( $this.find("input[type='file']").val() ) {
                formdata.append("characteristic[element_"+i+"][file]", fileDOM.files[0], fileDOM.files[0].name);
            }

        });

        $.ajax({
            url: "upload.php",
            type: "POST",
            data: formdata,
            processData: false,
            contentType: false
        });

    });

});

该代码运行良好，当我打印$_POST和$_FILES变量时，结果与我所期望的一样，但对于$_FILES则不然。我从文件中得到的是：

Array
(
    [characteristic] => Array
    (
        [name] => Array
        (
            [element_0] => Array
            (
                [file] => items.csv
            )

            [element_1] => Array
            (
                [file] => items.csv
            )
        )

        [type] => Array
        (
            [element_0] => Array
            (
                [file] => application/vnd.ms-excel
            )

            [element_1] => Array
            (
                [file] => application/vnd.ms-excel
            )
        )

        [tmp_name] => Array
        (
            [element_0] => Array
            (
                [file] => E:\wamp\tmp\php44DF.tmp
            )

            [element_1] => Array
            (
                [file] => E:\wamp\tmp\php44E0.tmp
            )
        )

        [error] => Array
        (
            [element_0] => Array
            (
                [file] => 0
            )

            [element_1] => Array
            (
                [file] => 0
            )

        )

        [size] => Array
        (
            [element_0] => Array
            (
                [file] => 8
            )

            [element_1] => Array
            (
                [file] => 8
            )
        )
    )
)

有什么办法能得到我预期的结果吗？

Answer 1

经过几天没有找到解决我的问题的办法，今天我决定找到它，我做到了。

首先，我尝试将每个div中的全部数据放入一个数组中，然后将该数组放入表单数据中，问题是在服务器上，我得到了一个[object file]，但无法从中获得任何信息。$_FILES数组是空的，所以我回滚到开始。

然后，看看我的javascript代码，更具体地说，这部分：

if ( $this.find("input[type='file']").val() ) {
    formdata.append("characteristic[element_"+i+"][file]", fileDOM.files[0], fileDOM.files[0].name);
}

这给了服务器上丑陋的数组，所以我认为数组是问题所在，我决定删除characteristic[]数组，并使用$_POST和$_FILES作为数据的数组容器。另外，我在将文件追加到格式化数据时删除了“file”索引。

$(".characteristicData").each(function(i, v) {

    $this = $(this);
    fileDOM = $this.find("input[type='file']")[0];

    formdata.append("element_"+i+"[id_characteristic]", $this.attr("id"));
    formdata.append("element_"+i+"[items]", $this.find("textarea").val());

    if ( $this.find("input[type='file']").val() ) {
        formdata.append("element_"+i, fileDOM.files[0], fileDOM.files[0].name);
    }

});

现在，当我将数据发送到服务器并打印值时，我得到了我的文件的预期值。

Array
(
    [element_0] => Array
        (
            [name] => 001.png
            [type] => image/png
            [tmp_name] => E:\wamp\tmp\php9BA.tmp
            [error] => 0
            [size] => 578
        )

)