title: Dropzone.js and remove button
body: <p>I amusing the dropzone.js to implement file upload feature. I create the form like this :</p>
  
  <pre><code>&lt;form action="/target-url" id="my-dropzone" class="dropzone"&gt;&lt;/form&gt;
  
  &lt;script&gt;
    // myDropzone is the configuration for the element that has an id attribute
    // with the value my-dropzone (or myDropzone)
    Dropzone.options.myDropzone = {
      init: function() {
        this.on("addedfile", function(file) {
  
          // Create the remove button
          var removeButton = Dropzone.createElement("&lt;button&gt;Remove file&lt;/button&gt;");
  
  
          // Capture the Dropzone instance as closure.
          var _this = this;
  
          // Listen to the click event
          removeButton.addEventListener("click", function(e) {
            // Make sure the button click doesn't submit the form:
            e.preventDefault();
            e.stopPropagation();
  
            // Remove the file preview.
            _this.removeFile(file);
            // If you want to the delete the file on the server as well,
            // you can do the AJAX request here.
          });
  
          // Add the button to the file preview element.
          file.previewElement.appendChild(removeButton);
        });
      }
    };
  &lt;/script&gt;
  </code></pre>
  
  <p>I have added the dropzone.js file in the html file header. However when I drag a file inside the box I got the following error:</p>
  
  <pre><code>Uncaught ReferenceError: Dropzone is not defined
  </code></pre>
  
  <p>Please any help.</p>