Adding more data to Dropzone.js post

Question

So, I have my implementation of this tutorial here: http://www.dropzonejs.com/bootstrap.html

It works great, and I upload files just fine. Now I want to send the user ID along with the image in the POST data when Dropzone uploads the image. I found an enyo tutorial here that explains how to add hidden form data to dropzone, but with the dropstrap tutorial, dropzone is provided, there is no form and therefore no hidden message data can be sent.

How can I use the code from the bootstrap tutorial associated with the above, and still still send the hidden input to load the script? Do I have to somehow convert the code provided to the form, and if so, how would I do it?

Answer 1

It's been a while since you asked this question, but based on dropzone website tips

http://www.dropzonejs.com/#tips

you can do one of three things -

1. if there is a form, add hidden parameters.

2. you can use the parameters like this:

new Dropzone({ url: "/", params: { foo: "bar" } }); 

3. handle the dispatch event in this way -

 myDropzone.on("sending", function(file, xhr, formData) { // Will sendthe filesize along with the file as POST data. formData.append("filesize", file.size); }); 

Answer 2

I find a textbook that you are a bit confusing, as there is no form in it. Just create a form with class="dropzone" and add hidden inputs. It shows only the default template for dropped files and some JS code for handling major events. I recommend checking out the Dropzone homepage for an example.

For example, in our code it looks something like this (edited a little):

 <form action="myAction" class="dropzone" id="dropzoneId" name="pictures"> <input type="hidden" name="id"> </form> 

And indeed it is. We have Javascript code to handle the hidden id field and some additional functions, but the identifier is sent along with the image data.

Answer 3

I know this is a pretty old post, but I tried to get SolarBear to work, and it worked for me when adding the "value" parameter to the hidden input, for example:

 <form action="/action.php" class="dropzone"> <input type="hidden" name="additionaldata" value="valueToPass" /> </form> 

Thank you for your help!