Determine when all files have uploaded successfully in dropzone.js

Question

I'm using dropzone.js to upload to my website. The uploader is in a modal, which I want to automatically close when all files have been uploaded successfully.

To do this I am using the following code:

buttonUpload.on("complete", function (file) {

    var remaining = buttonUpload.getRejectedFiles().length + buttonUpload.getQueuedFiles().length + buttonUpload.getUploadingFiles().length

    if (remaining == 0) {
        $("#modal-upload-file").modal('hide');
    }
});

I would expect this code to add together the number of files that have failed, have not yet uploaded and are uploading. If this is zero, then the modal closes.

I was able to determine that buttonUpload.getRejectedFiles() does not include files that received an error when uploading. From reading the documentation, I can see no way of checking if every file has uploaded successfully like I want to. How can I do this?

Answer 1

Here's my solution.

On success, the file is removed from the queue:

buttonUpload.on("success", function(file) {
    buttonUpload.removeFile(file);
});

Then, when the queue is completed, if any files remain they were not successful.

buttonUpload.on("queuecomplete", function (file) {
    if (buttonUpload.getAcceptedFiles().length > 0) {
        $("#file-error-warning").slideDown();
    } else {
        $("#modal-upload-file").modal('hide');
    }
});