JQuery 通过文件上传进行验证

Question

我一直在尝试从 ajax 获取文件到 php，但没有成功。所以我正在使用JQuery Validate

我有一个包含多个输入(姓名、电子邮件等)的表单，其中一个输入是文件类型。我执行了所有验证，甚至是对文件的验证，这一切都运行顺利。然后我来到了submitHandler函数。据我所知，通过 ajax 发送文件曾经存在问题，但现在是可能的。所以我正在努力

submitHandler: function (form) {
    var $form    = form,
        formData = new FormData(),
        params   = $form.serializeArray(),
        files    = $form.find('[name="fileOne"]')[0].files;

    $.each(files, function(i, file) {
        formData.append('uploadedFiles-' + i, file);
    });

    $.each(params, function(i, val) {
        formData.append(val.name, val.value);
    });

    $.ajax({
        type: "POST",
        url: "php/process.php",
        dataType: "json",
        data: formData
    }).done(function (response) {
        if (!response.success) {
            alert("Failed");
            console.log(response.errors);
        }
        else {
            alert("Worked");
        }
    });
    return false;
}

所以我希望能够获取我的文件(fileOne)并将其附加到我的表单数据中。然而，在 PHP 中我现在只是这样做

try {
    if(isset($_FILES['fileOne'])){
        var_dump("IN");
    }
    else {
        var_dump("NO FILE");
    }

} catch (RuntimeException $e) {
    echo $e->getMessage();
}

很多时候它甚至没有命中这个 PHP，因为表单提交时 URL 获取了所有数据(这通常发生在 JQuery 出现错误时)。当我让它工作时，我得到输出“无文件”。

那么我如何发送上传的文件以及表单数据的其余部分，以便我可以在 PHP 中处理它？<​​/p>

谢谢

Answer 1

您没有设置contentType: false, processData: false

 $.ajax({
    type: "POST",
    url: "php/process.php",
    dataType: "json",
    data: formData,
    mimeType: "multipart/form-data",
    contentType: false,
    processData: false
}).done(function (response) {
    if (!response.success) {
        alert("Failed");
        console.log(response.errors);
    }
    else {
        alert("Worked");
    }
});