2016-08-17 53 views
0

dropzone.jsを使用して複数のファイルが1つずつアップロードされる可能性はありますか?以下はカスタムDropzone設定スクリプトです。DropZone.jsを使用して複数のファイルを1つずつアップロード

Dropzone.options.myDropzone = { 
       autoProcessQueue: false, 
       parallelUploads: 10, 
       addRemoveLinks:true, 
       init: function() { 
        var submitButton = document.querySelector("#submit-all"); 
        myDropzone = this; // closure 
        submitButton.addEventListener("click", function() { 
         if(myDropzone.getQueuedFiles().length === 0) 
         { 
          alert("Please drop or select file to upload !!!"); 
         } 
         else{ 
          myDropzone.processQueue(); // Tell Dropzone to process all queued files. 
         } 
        }); 
       }, 
       url: "upload.php" 
      }; 

今のところ、すべてのファイルがすべてプロセスキュー内にアップロードされます。アップロードファイルのサイズが大きくなるため、すべてのファイルを1つずつアップロードする必要があります。同じものを短くするのを助けてください。

+0

「parallelUploads:1」を10から設定してみてください。 – itzmukeshy7

+0

@ itzmukeshy7:いいえ、parallelUploadsを10から1に設定すると、アップロードするファイルを1つだけ選択できます。実際、それは要件ではありません。アップロードするファイルが複数選択されている場合は、ファイルを1つずつキュー内で処理する必要があります。一度にすべてではありません。 – user3113732

+0

sorry @ itzmukeshy7。私はその事を誤解した。今私はparallelUploads = 1を設定します。それはまた期待どおりに動作していません。 – user3113732

答えて

3

ファイルを1つずつアップロードするために使用しました。 これが役立つことを願っています。 機能に応じた完全なコードをご希望の場合は、私にお知らせください。

お客様がファイルのアップロードを確認すると、startUpload()が呼び出されます。

Dropzone.autoDiscover = false; 
    var myDropzone = new Dropzone("#uploadModal", { 
     url: "upload.php", 
     paramName: "file_upload", 
     maxFilesize: 1024, 
     maxFiles: 200, 
     autoProcessQueue: false 
    }); 

    function startUpload(){ 
     for (var i = 0; i < myDropzone.getAcceptedFiles().length; i++) { 
      myDropzone.processFile(myDropzone.getAcceptedFiles()[i]); 
     } 
    } 

    myDropzone.on('success', function(file, result) { 
     try { 
      result = JSON.parse(result) 
      if (!result.error) { 
       if(myDropzone.getQueuedFiles().length === 0 && myDropzone.getUploadingFiles().length === 0){ 
        $("#uploadModal"). modal('hide'); 
        myDropzone.removeAllFiles(true) ; 
       } 
      } 
      //TODO - 
     } catch (e) { 
      //TODO - 
     } 
    }); 
+1

本当に行う必要があるのは、autoProcessQueueをtrueに、parallelUploadを1に設定するだけです。これは同じことを実現します。 – tom

3

あなたはにautoProcessQueueに真parallelUploadsを設定する必要があります。

autoProcessQueueをtrueに設定すると、dropzoneは自動的にキューを処理します。 parallelUploadsを1に設定すると、dropzoneはキューから一度に1つのファイルのみをアップロードします。

Dropzone.options.myDropzone = { 
      autoProcessQueue: true, 
      parallelUploads: 1, 
      addRemoveLinks:true, 
      init: function() { 
       var submitButton = document.querySelector("#submit-all"); 
       myDropzone = this; // closure 
       submitButton.addEventListener("click", function() { 
        if(myDropzone.getQueuedFiles().length === 0) 
        { 
         alert("Please drop or select file to upload !!!"); 
        } 
        else{ 
         myDropzone.processQueue(); // Tell Dropzone to process all queued files. 
        } 
       }); 
      }, 
      url: "upload.php" 
     }; 
関連する問題