Dropzone.js Example

by ganey

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.1.1/min/dropzone.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.1.1/min/dropzone.min.css">
<div class="dropzone" id="myDropzone">

</div>

JavaScript

Dropzone.options.myDropzone = {
  url: "/fake/location",
  autoProcessQueue: false,
  paramName: "file",
  clickable: true,
  maxFilesize: 5, //in mb
  addRemoveLinks: true,
  acceptedFiles: '.png,.jpg',
  dictDefaultMessage: "Upload your file here",
  init: function() {
    this.on("sending", function(file, xhr, formData) {
      console.log("sending file");
    });
    this.on("success", function(file, responseText) {
      console.log('great success');
    });
    this.on("addedfile", function(file){
  		console.log('file added');
  	});
  }
};