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); 
    } 
});