Menu
I just implemented Dropzone.js to make file uploads on my website easier. The file uploads fine, and after it finished uploading I give the file an id and return this id to the browser.
This works fine, except for that I don't know how to catch the id that gets returned from the server. In this SO answer I found some code that should supposedly do that, but it doesn't work for me. The code I have now is pasted below.
Does anybody know how I can get the value that is returned by the server? All tips are welcome!
<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
<script type="text/javascript" src="/static/js/external/dropzone.min.js"></script>
<link href="/static/css/external/dropzone.css" rel="stylesheet">
<script type="text/javascript">
$(function() {
Dropzone.options.uiDZResume = {
success: function(file, response){
console.log('WE NEVER REACH THIS POINT.');
alert(response);
}
};
});
</script>
</head>
<body>
<form action="/doc"
class="dropzone"
id="my-awesome-dropzone"></form>
</body>
</html>
294
"To access all files in the dropzone, use myDropzone. files ."
Dropzone. js is 'a light weight JavaScript library that turns an HTML element into a "dropzone"'. Users can drag and drop a file onto an area of the page, uploading to a server. If you would like to read more how all of this works skim through the Dropzone.
1. Link to the dropzone. js plugin's JavaScript and CSS files. jQuery library is optional.
Looking at the source code of dropzone.js, it seems that there is a lot of events you can listen to.
events: [
"drop"
"dragstart"
"dragend"
"dragenter"
"dragover"
"dragleave"
"addedfile"
"removedfile"
"thumbnail"
"error"
"errormultiple"
"processing"
"processingmultiple"
"uploadprogress"
"totaluploadprogress"
"sending"
"sendingmultiple"
"success"
"successmultiple"
"canceled"
"canceledmultiple"
"complete"
"completemultiple"
"reset"
"maxfilesexceeded"
"maxfilesreached"
]
Here the "success" event seems to be appropriate.
A good starting point would be to bind an event listener to your dropzone and see what data you get on such event.
$('#my-awesome-dropzone').on('success', function() {
var args = Array.prototype.slice.call(arguments);
// Look at the output in you browser console, if there is something interesting
console.log(args);
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
