ajax - 在模态框内重置 Dropzone

Question

我在 Bootstrap 主题的模式框中有一个表单。该表单包含几个输入字段和一个 Dropzone 字段，所有这些字段都通过 ajax 将数据发送到服务器。填写表格后，我显然需要为下一组输入重置表格。除了 Dropzone 图像之外，我已经成功地重置了表单字段。

所以现在当我点击提交时，填写表格后，数据就被输入了。单击按钮再次打开模式以添加新集时，以前的图像仍显示在那里。我需要它也消失。

我一直在 S.O 和许多其他地方寻找解决方案。我找不到解决方案。任何指导表示赞赏。

---

HTML:

<form enctype="multipart/form-data" id="addProductImageForm" class="dropzone dz-clickable" action="#">
  <div class="dz-default dz-message" ><span>Click here to upload Product Image</span></div>
</form>

---

JS:

Dropzone.options.addProductImageForm = {
paramName: "productImage", 
maxFilesize: 2,
maxFiles: 1,
uploadMultiple: false,
acceptedFiles: "image/*", 
dictDefaultMessage: "Click to Upload",
addRemoveLinks: true,
accept: function(file, done) { 
    if (file.name == "bg.png") {
        done("Naha, you don't.");
    }
    else {
        done();
    }
},
success: function(d, response, test) {
    var value = response.replace("int(0)", "");
    var value2 = value.replace(/(\r\n|\n|\r)/gm, "");
    $('#product_imageName').val(value2);
},
init: function() {
    this.on("maxfilesexceeded", function(file) {
        alert("No more files please!");
    });
}
};
$("#addProductImageForm").dropzone({url: "/path/to/upload_product_image.php"});

---

.
.
.
.

var formData = {
  (input values here)
};

$.ajax({
    type: 'POST', 
    url: 'path/to/projectsAction.php',
    data: formData,
    encode: true
})
        .done(function(data) {
            var value3 = data.replace(/(\r\n|\n|\r)/gm, "");
            $('#project_productId').append('<option value="' + value3 + '" selected="selected">' + formData.product_name + '</option>');
            $("#addProductForm").find("input[type=text], textarea, select").val("");
            $("#addProductImageForm").html("");// THIS IS THE LINE THAT REMOVES THE THUMBNAIL. (From the answer given by xrcwrn)
            $('.close').click();
        });

event.preventDefault();

Answer 1

如果你正在使用 dropzone

   <form action="/file-upload"
    class="dropzone"
  id="my-awesome-dropzone"></form>

在发布您的数据后重置您的 dropzone 容器

  $("#my-awesome-dropzone").html("");