I'm looking for a dropzone.js event that raises after the drop end and just before the uploading.
What I need is to have access to all the information about the dropped files at once, not file by file thus addedfile event is not an option.
I thought that the dragend event was the appropriate, but it's not triggered when I drop the files in my dropzone.
The code snippet that I'm using looks like as follows:
Dropzone.options.myDropzone = {
// Prevents Dropzone from uploading dropped files immediately
autoProcessQueue : false,
dictDefaultMessage: "Drop files or click here to upload a new DICOM series ...",
init : function() {
myDropzone = this;
//Restore initial message when queue has been completed
this.on("dragend", function(file) {
console.log("ondragend");
});
}
};
Am I missing something? Is there any other event in dropzone.js for this purpose?
I'm looking for a dropzone.js event that raises after the drop end and just before the uploading.
What I need is to have access to all the information about the dropped files at once, not file by file thus addedfile event is not an option.
I thought that the dragend event was the appropriate, but it's not triggered when I drop the files in my dropzone.
The code snippet that I'm using looks like as follows:
Dropzone.options.myDropzone = {
// Prevents Dropzone from uploading dropped files immediately
autoProcessQueue : false,
dictDefaultMessage: "Drop files or click here to upload a new DICOM series ...",
init : function() {
myDropzone = this;
//Restore initial message when queue has been completed
this.on("dragend", function(file) {
console.log("ondragend");
});
}
};
Am I missing something? Is there any other event in dropzone.js for this purpose?
3 Answers
Reset to default 9There is an event called addedfiles, which will fire on both "drag-and-drop" and manual file selection.
this.on("addedfiles", function(files) {
console.log(files.length + ' files added');
});
If you want to have a callback for the drop event, you should use 'drop'. In the event take a look at the 'files' Array. But be aware, that this event isn't fired if the user clicks at the dropzone and selects a file from there.
Dropzone.options.MyDropzone = {
autoProcessQueue : false,
dictDefaultMessage: "Drop files or click here to upload a new DICOM series ...",
init : function() {
myDropzone = this;
//Restore initial message when queue has been completed
this.on("drop", function(event) {
console.log(myDropzone.files);
});
}
};
See this fiddle for example: jsfiddle.net/qqkbzv5a/2/
Finally I have use the selectedfiles event, which responses either the drop and the click action at the dropzone.
this.on("selectedfiles", function(listFiles) {
cont_files = listFiles.length;
});