Using Dropzone.js to upload after new user creation, send headers

Question

I'm using a great plugin - dropzone.js (dropzonejs.com) to make my site a little more fancy when registering a new user. Basically, the user fills out a form, drops a couple images into the "dropzone", and clicks "Submit", which fires an ajax call that posts the form to a php script. I have dropzone parameters set to enqueForUpload:false, which keeps the files from auto-uploading, since I need them to upload into uploads/$userid, after the new user id has been created. I can give dropzone header params, which I'm assuming post to the url, similar to an ajax call, instead of data: {'userid': userid}, dropzone uses headers: {'userid': userid}... However, dropzone gets initialized on document.ready, and as the userid variable isn't declared yet, dropzone fails to initialize. I'm guessing I'm going to need to initialize dropzone with document.ready, but not give it headers just yet. Then after the ajax form processing is successful and returns userid, call dropzone to upload and give it t…

Accepted Answer

If you use the latest Dropzone version, the parameter `enqueueForUpload` has been removed, in favour of `autoProcessQueue` which makes the whole queuing easier.

So, just call `myDropzone.processQueue()` as soon as you want all files to be uploaded.

To add additional parameters to the `XHR` you can simply register to the `sending` event, which gets the `xhr` object as second and `formData` as third parameter, and add the data yourself. Something like this:

```
myDropzone.on("sending", function(file, xhr, formData) {
  // add headers with xhr.setRequestHeader() or
  // form data with formData.append(name, value);
});
```

Using Dropzone.js to upload after new user creation, send headers

Solution

Problem

Related problems