如何在我自己的函数中使用Dropzone.js

Question

I am having difficulties integrating Dropzone.js with my own ajax function, I don't know what I should do to use dropzone inside my ajax function.

This is my own ajax function code :

function _ajaxForm(formHandler){
var action = $(formHandler).attr('action');
$.post(action, $(formHandler).serialize(), function(data){
    // I want to submit my fields and my form upload using this function
}, 'json');}

Answer 1

You just need to configure your dropzone accordingly.

Using the sending event you could do something like this:

Dropzone.options.myAwesomeDropzone = {
  // Some default configurations
  paramName: "file", // The name that will be used to transfer the file
  maxFilesize: 2, // MB
  // Additional configurations needed for your ajax call
  url: "insertyoururlhere",
  init: function () {
      this.on("error", function (error, message) {
        //do something to handle the error
      });
      this.on("success", function (success, response) {
        //do something
      });
      this.on("sending", function (file, xhr, formData) {
        //add any form data that you would have in your ajax function eg:
        //formData.append("id", 123);
      });
      this.on("complete", function () {
        this.removeAllFiles(true);
        //do something
      });
    }
});

See this , this and this answer which might also help.