Question

我想使用drop zone拖放多个文件up-loader。它所做的是使用Ajax自动将文件上传到服务器。但是我希望它能够执行另一个功能。我希望每当我选择一个文件时，它应该创建一个<input type="file" name="file1"><input type="file" name="file2">，依此类推，每个字段都保存该文件。所以，当我最后点击提交按钮。然后我应该能够手动上传。

场景是我要上传产品。通过拖放我将上传产品的图片。我知道这张图片可以上传，价值可以保存到数据库，但是，在我还没有提交表格的时候，还没有产品ID。并且在图像选项卡中有字段，我们在其中输入产品ID。任何有关实现这一目标的建议。

Answer 1

您应该将autoProcessQueue参数设置为false。

你可以这样做：

HTML - 添加按钮

<form action="your_action" class="dropzone" id="your_form_id">
     <div class="fallback">
         <input name="file" type="file" />
     </div>
</form>

<button type="button" id="btn_upload">Upload</button>

JavaScript - 将autoProcessQueue设置为false，在按钮ID上添加click事件并触发processQueue事件以上传文件

Dropzone.options.your_form_id = {
    autoProcessQueue: false,

    init: function (e) {

        var myDropzone = this;

        $('#btn_upload').on("click", function() {
            myDropzone.processQueue(); // Tell Dropzone to process all queued files.
        });

        // Event to send your custom data to your server
        myDropzone.on("sending", function(file, xhr, data) {

            // First param is the variable name used server side
            // Second param is the value, you can add what you what
            // Here I added an input value
            data.append("your_variable", $('#your_input').val());
        });

    }
};

使用dropzone而不自动上传

1 个答案: