Dropzonejs不能提交正确

Question

这里是我的悬浮窗的配置：

var myDropzone = new Dropzone(".myDZ", { 
    url: $('#form').attr('action'), 
    previewTemplate: previewTemplate, 
    uploadMultiple: true, 
    previewsContainer: "#previews", 
    clickable: "#fileinput-btn", 
    autoProcessQueue: false, 
    init: function() { 
     var dz = this; 
     this.element.querySelector("button[type=submit]").addEventListener("click", function (e) { 
      e.preventDefault(); 
      dz.processQueue(); 
     }); 
    } 
}); 

提交按钮被按下后，我可以从数据被正确提交后台看到。但是，在后端返回响应之后，前端将不会对其做出反应。表单页面保持不变而不显示返回的消息，再次单击提交按钮不会触发任何提交。

我尝试这样做：

this.element.querySelector("button[type=submit]").addEventListener("click", function (e) { 
      e.preventDefault(); 
      dz.processQueue(); 
      document.getElementById("form").submit(); 
     }); 
    } 
}); 

这将迫使表单提交两次，但显示的第2次尝试后，正确的反应。这有效，但感觉不对。

上什么可能出了问题有什么建议？

Answer 1

我会同意，提交两次是那种脏。 您可以尝试赶上一个成功的功能时，您的反应，因为悬浮窗异步等待。

var myDropzone = new Dropzone(".myDZ", { 
    url: $('#form').attr('action'), 
    previewTemplate: previewTemplate, 
    uploadMultiple: true, 
    previewsContainer: "#previews", 
    clickable: "#fileinput-btn", 
    autoProcessQueue: false, 
    init: function() { 
     var dz = this; 
     this.element.querySelector("button[type=submit]").addEventListener("click", function (e) { 
      e.preventDefault(); 
      dz.processQueue(); 
     }); 
    }, 
    // Try this success. 
    success: function (data, response) { 
     console.log(response); 
    } 
});