Dropzone.js remove files after an event is fired

Question

so heres my code:

 Dropzone.options.myDropzone = {

  // Prevents Dropzone from uploading dropped files immediately
  autoProcessQueue: false,

  init: function() {
    var submitButton = document.querySelector("#submit-all")
        myDropzone = this; // closure

      submitButton.addEventListener("click", function() {
      myDropzone.processQueue(); // Tell Dropzone to process all queued files.
      myDropzone.removeAllFiles();
      console.log("a");

    });

// You might want to show the submit button only when 
// files are dropped here:
this.on("addedfile", function() {
  // Show submit button here and/or inform user to click it.
});

} };

how can I add removeAllfiles after clicking the upload button. thanks

Answer 1

This should work:

Dropzone.options.myDropzone = {

  autoProcessQueue: false,

  init: function() {
    var submitButton = document.querySelector("#submit-all")
        myDropzone = this;

    submitButton.addEventListener("click", function() {
      myDropzone.processQueue();
    });

    // Execute when file uploads are complete
    this.on("complete", function() {
      // If all files have been uploaded
      if (this.getQueuedFiles().length == 0 && this.getUploadingFiles().length == 0) {
        var _this = this;
        // Remove all files
        _this.removeAllFiles();
      }
    });

  }

};

By using this.on("complete", function() { //Code to be executed }); you are able to execute your code once the files have been uploaded. In your case, you can remove all of the files.