Dropzone预览消失但继续上传

Question

我已经按照这里的说明进行操作：http://www.dropzonejs.com/bootstrap.html我已经完成了所有工作，但当我点击表格中单个上传的开始按钮时，它将开始进度然后消失，但它会继续在幕后上传。

这是HTML：

<div class="container">

  <?php echo form_open_multipart( '/upload/video', $attributes);?>

  <div id="actions" class="row">

    <div class="col-lg-7">
      <!-- The fileinput-button span is used to style the file input field as button -->
      <span class="btn btn-success fileinput-button dz-clickable">
            <i class="glyphicon glyphicon-plus"></i>
            <span>Add files...</span>
      </span>
      <button type="submit" class="btn btn-primary start">
        <i class="glyphicon glyphicon-upload"></i>
        <span>Start upload</span>
      </button>
      <button type="reset" class="btn btn-warning cancel">
        <i class="glyphicon glyphicon-ban-circle"></i>
        <span>Cancel upload</span>
      </button>
    </div>

    <div class="col-lg-5">
      <!-- The global file processing state -->
      <span class="fileupload-process">
          <div id="total-progress" class="progress progress-striped active" role="progressbar" aria-valuemin="0" aria-valuemax="100" aria-valuenow="0">
            <div class="progress-bar progress-bar-success" style="width:0%;" data-dz-uploadprogress=""></div>
          </div>
        </span>
    </div>

  </div>

  <div class="row">
    <div class="col-xs-12 col-sm-12 col-md-12">
      <!-- HTML heavily inspired by http://blueimp.github.io/jQuery-File-Upload/ -->
      <div class="table table-striped" class="files" id="previews">

        <div id="template" class="file-row">
          <!-- This is used as the file preview template -->
          <div>
            <span class="preview"><img data-dz-thumbnail /></span>
          </div>
          <div>
            <p class="name" data-dz-name></p>
            <strong class="error text-danger" data-dz-errormessage></strong>
          </div>
          <div>
            <p class="size" data-dz-size></p>
            <div class="progress progress-striped active" role="progressbar" aria-valuemin="0" aria-valuemax="100" aria-valuenow="0">
              <div class="progress-bar progress-bar-success" style="width:0%;" data-dz-uploadprogress></div>
            </div>
          </div>
          <div>
            <button class="btn btn-primary start">
              <i class="glyphicon glyphicon-upload"></i>
              <span>Start</span>
            </button>
            <button data-dz-remove class="btn btn-warning cancel">
              <i class="glyphicon glyphicon-ban-circle"></i>
              <span>Cancel</span>
            </button>
            <button data-dz-remove class="btn btn-danger delete">
              <i class="glyphicon glyphicon-trash"></i>
              <span>Delete</span>
            </button>
          </div>
        </div>

      </div>
    </div>
  </div>

  <div class="row dropit">
    <div class="dz-message" data-dz-message><span style="font-size: 72px"><i class="fa fa-cloud-upload"></i></span>
      <br /><span>Drop videos here to upload</span>
    </div>
    <div class="fallback">
      <input name="files[]" type="file" multiple/>;
    </div>
  </div>

  <?php echo form_close(); ?>

</div>

这是JS：

$(document).ready(function() {
  // Get the template HTML and remove it from the doumenthe template HTML and remove it from the doument
  var previewNode = document.querySelector("#template");
  previewNode.id = "";
  var previewTemplate = previewNode.parentNode.innerHTML;
  previewNode.parentNode.removeChild(previewNode);

  Dropzone.options.myAwesomeDropzone = { // Make the whole body a dropzone
    thumbnailWidth: 80,
    thumbnailHeight: 80,
    parallelUploads: 20,
    previewTemplate: previewTemplate,
    autoProcessQueue: false, // Make sure the files aren't queued until manually added
    previewsContainer: "#previews", // Define the container to display the previews
    clickable: ".fileinput-button", // Define the element that should be used as click trigger to select files.
    init: function() {
      myDropzone = this; // closure
      myDropzone.on("addedfile", function(file) {
        // Hookup the start button
        file.previewElement.querySelector(".start").onclick = function() {
          myDropzone.processQueue();
        };
      });
      // Update the total progress bar
      myDropzone.on("totaluploadprogress", function(progress) {
        document.querySelector("#total-progress .progress-bar").style.width = progress + "%";
      });

      myDropzone.on("sending", function(file) {
        // Show the total progress bar when upload starts
        document.querySelector("#total-progress").style.opacity = "1";
        // And disable the start button
        file.previewElement.querySelector(".start").setAttribute("disabled", "disabled");
      });

      // Hide the total progress bar when nothing's uploading anymore
      myDropzone.on("queuecomplete", function(progress) {
        document.querySelector("#total-progress").style.opacity = "0";
      });

      // Setup the buttons for all transfers
      // The "add files" button doesn't need to be setup because the config
      // `clickable` has already been specified.
      document.querySelector("#actions .start").onclick = function() {
        myDropzone.enqueueFiles(myDropzone.getFilesWithStatus(Dropzone.ADDED));
      };
      document.querySelector("#actions .cancel").onclick = function() {
        myDropzone.removeAllFiles(true);
      };
    }
  };
});

如果我在这里做了什么：http://www.dropzonejs.com/bootstrap.html那么一切都没有用，所以我做了一些改动。

我做错了什么？

基本上我想要完成的是能够删除多个文件并让用户填写一些日期，然后单击上传单个文件。我能找到的唯一文档是上传所有文件。我想一次做一个或全部。

编辑：如果我删除autoProcessQueue: false,，它的运行没有任何问题。只有当我按下按钮才能上传。

编辑：我已更新我的代码。我还将其缩小到仅仅是Firefox的问题