Dropzone.js 提交多ID答案

【问题标题】：Dropzone.js submit for multi idsDropzone.js 提交多ID
【发布时间】：2018-08-13 00:00:51
【问题描述】：

使用 Dropzone 将多个文件提交到使用不同 id 的多个表单但它只提交最后一个 id

这是我们用来提交的onclick提交功能

我选择了所有行 id 2.用不同的url（forms/upload_files/'id'）将它收集到ids数组中

这是 Dropzone 功能

     if($('#dropzoneDragArea').length > 0){
    submitDropzone = new Dropzone("#id-form",  $.extend({},_dropzone_defaults(),{
      autoProcessQueue: false,
      parallelUploads: 100,
      uploadMultiple: true,
      clickable: '#dropzoneDragArea',
      previewsContainer: '.dropzone-previews',
      addRemoveLinks: true,
      maxFiles: 2,

   }));
 }

这是onclick函数

function submit(event) {
var ids = [];

var rows = $('.table-rows').find('tbody tr');
$.each(rows, function() {
    var checkbox = $($(this).find('td').eq(0)).find('input');
    if (checkbox.prop('checked') == true) {

        submitDropzone.options.url = admin_url + 'forms/upload_file/' + checkbox.val();
        ids.push(submitDropzone.options.url);

    }
});

submitDropzone.processQueue();

}

请问有什么建议

【问题讨论】：

submitDropzone.options.url 是什么？您是否将autoProcessQueue 设置为 false？
这是包含文件的 Dropzone 的主要功能，它的工作没有问题，但只有 .processQueue() 只是上传最后一个表单
@AndrewLohr 是 autoProcessQueue 设置为 false
您在每次迭代中都覆盖了options.url，因此当您处理队列时，options.url 仅包含数组中的最后一个 url。现在，如果我理解正确，您要做的是使用一个 dropzone 将相同的文件或文件上传到多个 url？
@wallek876 是的，没错，当我把 submitDropzone.processQueue();在同一次迭代中，它只提交第一个 id

标签： javascript dropzone.js dropzone

【解决方案1】：

要使用相同的 dropzone 将相同的文件或文件发送到多个 url，一个选项是处理队列，然后重新排队文件并更新选项中的 url，并为您想要的每个不同 url 再次处理队列将文件发送到。

假设您已经拥有填充了 URL 的 ids 数组，您的提交函数可能如下所示：

function submit(event) {

  var ids = [];

  // populate urls array

  // submit the files to each url
  for (let i = 0; i < ids.length; i++) {
    submitDropzone.options.url = myUrls[i];

    submitDropzone.processQueue();

    // if there is still urls requeue the files
    if (i !== myUrls.length - 1) {
      for (let file of submitDropzone.files) {
        if (file.status === Dropzone.SUCCESS || file.status === Dropzone.PROCESSING) {
          file.status = Dropzone.QUEUED;
        }
      }
    }
  }
}

请注意，您必须将状态更改回排队，因为.processQueue() 不会上传已上传或正在处理的文件。

【讨论】：