如何使用表单发送多个Dropzone.js上传文件?

时间:2019-02-28 12:58:31

标签: javascript dropzone.js

我有四个使用 dropzone 的字段。我没有在form标记中使用dropzone类,因为它将整个表单变成一个放置区。

我正尝试将这些文件作为表单变量发送到我的action页(然后由Coldfusion中的CFFILE处理)。

我不确定如何将这些div中的文件附加到操作页面可以理解的表单元素中。

HTML :(仅显示4个中的2个)

<form
  action="/freeform-thankyou"
  enctype="multipart/form-data"
  method="POST"
  class=""
>
  <div class="col-lg-3">
    Photo 1*
    <div class="well">
      <div class="form-group">
        <div class="fallback">
          <div class="dropzone" id="myDropzone1"></div>
        </div>
      </div>
    </div>
  </div>

  <div class="col-lg-3">
    Photo 2*
    <div class="well">
      <div class="form-group">
        <div class="fallback">
          <div class="dropzone" id="myDropzone2"></div>
        </div>
      </div>
    </div>
  </div>
</form>

JS :(仅显示4个中的2个)

 <script>
  Dropzone.options.myDropzone1 = {
    url: "sub-freeform-confirmation.cfm",
    autoProcessQueue: false,
    uploadMultiple: true,
    parallelUploads: 4,
    maxFiles: 1,
    maxFilesize: 1,
    acceptedFiles: "image/*",
    addRemoveLinks: true
  };
</script>

<script>
  Dropzone.options.myDropzone2 = {
    url: "sub-freeform-confirmation.cfm",
    autoProcessQueue: false,
    uploadMultiple: true,
    parallelUploads: 4,
    maxFiles: 1,
    maxFilesize: 1,
    acceptedFiles: "image/*",
    addRemoveLinks: true
  };
</script>

感谢您对此提供的帮助和/或微调我的问题。

0 个答案:

没有答案