使用 Laravel 上传 jQuery 文件而不是自动上传

Question

在自动加载关闭的情况下，我在使用 jQuery FileUpload 时遇到了很多问题。我需要在一个请求中提交所有内容——而不是多个。我已经为此奋斗了 3 天，并进行了很多研究。我只是觉得我错过了一件事情。这是我得到的：

jQuery:

$(function(){

var ul = $('#upload ul');

// Initialize the jQuery File Upload plugin
$('#entry_form_doc').fileupload({
    type: 'POST',
    url: 'leadresources/submitDoc',
    limitMultiFileUploads: 5,
    autoUpload: false,
    dropZone: $('#drop'),
    add: function (e, data) {

//fired by a click of a button.
        $("#submit_doc").unbind('click').on('click', function(){
            data.formData = {files: data.originalFiles};
            data.submit();
        });
    },
    fail:function(e, data){
        // Something has gone wrong!
        data.context.addClass('error');
    }

});

});

这是我 print_r() 到日志中时 Laravel 得到的：

 [2015-03-16 14:27:27] production.INFO: Array
(
    [lb_id] => 
    [lb_doc_title] => asdf
    [lb_docs_summary] => 
    [file] => Array
        (
            [0] => Symfony\Component\HttpFoundation\File\UploadedFile Object
                (
                    [test:Symfony\Component\HttpFoundation\File\UploadedFile:private] => 
                    [originalName:Symfony\Component\HttpFoundation\File\UploadedFile:private] => photo 2.JPG
                    [mimeType:Symfony\Component\HttpFoundation\File\UploadedFile:private] => image/jpeg
                    [size:Symfony\Component\HttpFoundation\File\UploadedFile:private] => 498589
                    [error:Symfony\Component\HttpFoundation\File\UploadedFile:private] => 0
                    [pathName:SplFileInfo:private] => C:\xampp\tmp\php31F9.tmp
                    [fileName:SplFileInfo:private] => php31F9.tmp
                )
        )
)
 [] []
    )
     [] []

现在，它只返回第一个对象，没有别的。我想这是有道理的，因为 data.submit 是在第一张图片上触发的，然后解除绑定。

很长一段时间以来，我收到了多次提交，但我只希望它与 fileListArray 一起提交一次——而不是单个文件。我试图创建一个文件列表数组，但 Laravel 记录了一个 [object FileList] 就是这样。

那么有没有其他人能够在没有自动加载的情况下在一个请求中触发它——而不是多个请求。我关注了documentation，它谈到了 singleFileUploads 但仍然......没有用。

只是好奇是否有其他人对此有智慧。这是一个很棒的插件——只是真的很难弄清楚。

编辑：

我还应该说，我想要关闭自动加载的原因是我需要先提交 3 个表单字段来返回一个 ID，这样我才能将 ID 附加到这些文档中。

Answer 1

这真的不是一个答案（所以我不打算标记它），但我确实找到了另一个不那么喜怒无常的插件。我最终只使用了Dropzone。它更易于使用，并且具有我正在寻找的更多功能。

编辑 有人问我如何使用 Dropzone 做到这一点。我是这样做的：

$("#entryDoc").dropzone({ 
    url: "submitDoc",
    uploadMultiple: true,
    maxFiles: 5,
    parallelUploads: 5,
    autoProcessQueue:false,
    addRemoveLinks: true,
    thumbnailWidth: 100,
    thumbnailHeight: 100,
    paramName: 'files',
    dictRemoveFile: 'X',
    dictCancelUpload: 'Cancel',
    dictFallbackMessage: 'Your browser does not support dropzone. Please update your browser',
    dictInvalidFileType: 'File type not accepted. It has been removed from the queue.',
    dictFileTooBig: 'File is too big. It has been removed from the queue.',
    maxfilesexceeded: 'Only 5 files can be uploaded.',
    dictResponseError: 'Could not upload your files. Please try again or reach out to the developer.',
    fallback: function(){
        $('#entryDoc').html('Please update your browser.');
    },
    init: function(){
        var myDropZone = this;

        myDropZone.on("sendingmultiple", function (files, xhr, formData) {     //this form data gets sent over with the files.
            formData.append("action", $('#action').val());
            formData.append("lb_type_code", 'files');
            formData.append("lb_id", $('#lb_id').val());
        });

        $("#submit_doc").click(function () {
            var check = formValidation($('#files_container'));

            if(!check){
                $.jqDialog.alert("You are missing some required fields.");
                return false;
            }

            myDropZone.processQueue();
        });
    }, 
    success: function(){
        //what you want it to do after it successfully uploaded
    }, 
    error: function(file, errorMessage){
        //error here
    }
});