title: DropZone.js uploading is not working on programmatically
body: <p>I am working on dropzone js programmatically. this is My div,</p>
  
  <pre><code>&lt;div class="dropzone" id="my-dropzone"&gt; 
      &lt;div class="dz-message"&gt;
          &lt;div class="col-xs-8"&gt;
              &lt;div class="message"&gt;
                  &lt;p&gt;Drop files here or Click to Upload&lt;/p&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div class="fallback"&gt;
          &lt;input type="file" name="file" multiple&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>and rpzone class is
  // Dropzone class:</p>
  
  <pre><code>var myDropzone = new Dropzone("div#my-dropzone", { url: "/file/post"});
  </code></pre>
  
  <p>but when I drag and drop images to dropzone box images are preview with cross symbols (not success upload). then how can I fix this problem? 
  dropzone.confif.js</p>
  
  <pre><code>var total_photos_counter = 0;
  Dropzone.options.myDropzone = {
      uploadMultiple: true,
      parallelUploads: 2,
      maxFilesize: 5,
      previewTemplate: document.querySelector('#preview').innerHTML,
      addRemoveLinks: true,
      dictRemoveFile: 'Remove file',
      dictFileTooBig: 'Image is larger than 16MB',
      timeout: 10000,
  
      init: function () {
          this.on("removedfile", function (file) {
              $.post({
                  url: '/images-delete',
                  data: {id: file.name, _token: $('[name="_token"]').val()},
                  dataType: 'json',
                  success: function (data) {
                      total_photos_counter--;
                      $("#counter").text("# " + total_photos_counter);
                  }
              });
          });
      },
      success: function (file, done) {
          total_photos_counter++;
          $("#counter").text("# " + total_photos_counter);
      }
  };
  </code></pre>