How to upload more than 2 files by dropzone.js with button?

@rollin 

To upload more than 2 files using Dropzone.js with a button, you can create a custom button that triggers the file selection dialog when clicked. Here's an example of how you can achieve this:

1. Create a HTML file input element and a button:

1
2

<input type="file" id="fileInput" multiple style="display: none;">
<button id="uploadButton">Upload Files</button>

1. Initialize Dropzone.js with your custom options and configure it to accept the files dropped or selected in the file input element:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14

Dropzone.autoDiscover = false;

var myDropzone = new Dropzone("#fileInput", {
  url: "/your-upload-url",
  autoProcessQueue: false
});

document.getElementById("uploadButton").addEventListener("click", function() {
  myDropzone.hiddenFileInput.click();
});

myDropzone.on("addedfile", function(file) {
  myDropzone.processFile(file);
});

In this example, we create a custom file input element with multiple selection enabled and a button to trigger the file selection dialog. When the button is clicked, the hidden file input element is programmatically clicked, allowing the user to select multiple files. When files are added, they are processed immediately.

By following these steps, you can upload multiple files using Dropzone.js with a custom button.