如何通過Dropzone.js上傳超過2個文件，並使用按鈕

Question

我爲上傳文件製作了一個簡單的表單。使用表單我可以將多個文件添加到隊列中。使用特殊按鈕，我可以從隊列中刪除文件。但由於某種原因，它不能以我想要的方式工作。通過點擊「卸載文件」，只有2個文件正在上傳到服務器。如果我第二次點擊比第二個文件正在上傳。所有的代碼都在下面。如何通過點擊按鈕來上傳所有文件？提前致謝。

HTML：

<div class="panel panel-default"> 
    <div class="panel-heading"> 
     <strong>Прикрепить файлы</strong> 
    </div> 
    <div class="panel-body"> 
     <button type="button" class="btn btn-primary" id="add-file"> 
     <span class="glyphicon glyphicon-folder-close" aria-hidden="true"></span> Обзор... 
     </button> 
     <button type="button" class="btn btn-primary" id="upload-file"> 
     <span class="glyphicon glyphicon-folder-close" aria-hidden="true"></span> Загрузить 
     </button> 
     <ul class="list-group dropzone-previews" style="margin-top: 10px; margin-bottom: 0;"></ul> 
    </div> 
</div> 

JS：

$(".panel").dropzone({ 
     url: "upload.php", 
     autoProcessQueue: false, 
     init: function() { 
     var myDropzone = this; 
      $('#upload-file').click(function() { 
       myDropzone.processQueue(); 
      }); 
     }, 
     clickable: '#add-file', 
     acceptedFiles: 'image/*,application/pdf,application/msword', 
     previewsContainer: '.dropzone-previews', 
     previewTemplate: '<li class="working list-group-item">' + 
      '<span data-dz-name></span> <span data-dz-size></span> (<u data-dz-remove>Удалить</u>)' + 
      '<div class="progress" style="margin-top: 10px; margin-bottom: 0;">' + 
      '<div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" data-dz-uploadprogress></div>' + 
      '</div></li>' 
    }); 

而且在我的PHP服務器腳本：

<?php 
$ds = DIRECTORY_SEPARATOR; 
$storeFolder = 'uploads'; 
if (!empty($_FILES)) { 
    $tempFile = $_FILES['file']['tmp_name']; 
    $targetPath = dirname(__FILE__) . $ds. $storeFolder . $ds; 
    $targetFile = $targetPath. $_FILES['file']['name']; 
    move_uploaded_file($tempFile,$targetFile); 
} 
?> 

Answer 1

parallelUploads的價值就提高到10或20.默認情況下，將一次發送兩個文件到服務器，所以你需要增加parallelUploads的值，它會起作用。

$(".panel").dropzone({ 
      url: "upload.php", 
      autoProcessQueue: false, 
      init: function() { 
       var myDropzone = this; 

      }, 
      parallelUploads: 20, 
      clickable: '#add-file', 
      acceptedFiles: 'image/*,application/pdf,application/msword', 
      previewsContainer: '.dropzone-previews', 
      previewTemplate: '<li class="working list-group-item">' + 
        '<span data-dz-name></span> <span data-dz-size></span> (<u data-dz-remove>Удалить</u>)' + 
        '<div class="progress" style="margin-top: 10px; margin-bottom: 0;">' + 
        '<div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" data-dz-uploadprogress></div>' + 
        '</div></li>' 
     }); 
     $('#upload-file').click(function() { 
      myDropzone.processQueue(); 
     });