Dropzone.js is a JavaScript library that turns any HTML element into a dropzone. This means that a user can drag and drop a file onto it, and the file gets uploaded to the server via XHR.
The file either gets uploaded directly to the configured URL, or you can handle and manage the file upload yourself.
If you want support, please use the discussions section or stackoverflow with the dropzone.js
tag and not the GitHub issues tracker. Only post an issue here if you think you discovered a bug or have a feature request.
Please read the contributing guidelines before you start working on Dropzone!
Quickstart
The recommended way to install Dropzone is with yarn and webpack. I'll provide an example project soon!
Download the standalone files and import them on your website. (The JavaScript files in there are UMD modules, compatible with requirejs).
For more information, please consult the Documentation.
Dropzone does not depend on jQuery but has jQuery integration.
Main features
- Beautiful by default
- Image thumbnail previews. Simply register the callback
thumbnail(file, data)
and display the image wherever you like - Retina enabled
- Multiple files and synchronous uploads
- Progress updates
- Support for large files
- Complete theming. The look and feel of Dropzone is just the default theme. You can define everything yourself by overwriting the default event listeners.
- Browser image resizing (resize the images before you upload them to your server)
- Well tested
Documentation
For all the configuration options and installation guide please visit the documentation site.
If you simply want to look up the configuration options, look at src/options.js.
Examples
For examples, please see the GitLab wiki.
Server side implementation
Dropzone does not provide the server side implementation of handling the files, but the way files are uploaded is identical to simple file upload forms like this:
<form action="" method="post" enctype="multipart/form-data">
<input type="file" name="file" />
</form>
To handle basic file uploads on the server, please look at the corresponding documentation. Here are a few documentations, if you think I should add some, please contact me.
Compatibility
Dropzone supports all current browsers and IE up to IE11.
For all the other browsers, dropzone provides an oldschool file input fallback.
MIT License
See LICENSE file