dropzone形式出现在全身。

Question

我将这段代码用于以正常形式插入 dropzone

索引.php

        <form id="my-awesome-dropzone"  class="dropzone" action="upload.php">
          <div class="dropzone-previews"> </div> <!-- this is were the previews should be shown. -->

          <!-- Now setup your input fields -->
          <input type="text" name="Name" />
          <input type="text" name="Description" />

          <button type="submit">Submit data and files!</button>

        </form>

自定义 dropzone JS

   Dropzone.options.myAwesomeDropzone = { 
   autoProcessQueue: false,
        uploadMultiple: false,
         parallelUploads: 100,
          maxFiles: 100,


    init: function() {
var myDropzone = this;


this.element.querySelector("button[type=submit]").addEventListener("click", function(e) {

  e.preventDefault();
  e.stopPropagation();
  myDropzone.processQueue();
});


this.on("sendingmultiple", function() {
  alert("successfully");
});
this.on("successmultiple", function(files, response) {
  alert("successfully");

});
this.on("errormultiple", function(files, response) {
  alert("Error");

});}}

请高手大哥帮帮我！下拉表格带有整个表格。我需要在这段代码中修复什么。

Answer 1

我没有理解整个问题，但我在您的代码中只看到了几个问题。

在下面的 sn-p 中，我更新了您的代码以查看警报消息：

$(function () {
  Dropzone.options.myAwesomeDropzone = {
    previewsContainer: '.dropzone-previews',
    autoProcessQueue: false,
    uploadMultiple: false,
    parallelUploads: 100,
    maxFiles: 100,
    init: function () {
      var myDropzone = this;

      this.element.querySelector("button[type=submit]").addEventListener("click", function (e) {
        e.preventDefault();
        e.stopPropagation();
        myDropzone.processQueue();
      });
    },
    sending: function(file, xhr, formData) {
      alert('sending');
    },
    sendingmultiple: function (file, xhr, formData) {
      alert("successfully");
    },
    successmultiple: function (file, xhr, formData) {
      alert("successfully");

    },
    error: function (a, errorMessage, xhr) {
      alert("Error");
    }
  };
});

<script src="http://code.jquery.com/jquery-1.12.1.min.js"></script>

<link href="https://cdnjs.cloudflare.com/ajax/libs/dropzone/4.3.0/dropzone.css" rel="stylesheet">
    <script src="https://cdnjs.cloudflare.com/ajax/libs/dropzone/4.3.0/dropzone.js"></script>

<form id="my-awesome-dropzone" class="dropzone" action="upload.php">
    <div class="dropzone-previews"></div>
    <!-- this is were the previews should be shown. -->

    <!-- Now setup your input fields -->
    <input type="text" name="Name"/>
    <input type="text" name="Description"/>

    <button type="submit">Submit data and files!</button>

</form>