Posting additional data with Dropzone and params

Viewed 70

I am using Dropzone and the bootstrap example to upload files. I want to also POST additional data. I have tried a number of variations after reading the answers to other questions but I can't quite get the syntax right to get the data from the input statement as I am not very experienced with javascript.

I have two fields

<input type="text" name="firstname" id="firstname">
<input type="text" name="lastname" id="lastname">

and I have tried to add params

params: {
  firstname: ?????,
  lastname: ?????,
},

I know that the method works as if I use

params: {
  firstname: "abcde",
  lastname: "vwxyz",
},

then abcde and vwxyz are posted. I just can't get the data from the input statements to POST.

1 Answers

The question is divided to 2.

  1. How to get the values of the inputs.
  2. How to pass params to Dropzone.

The answers:

  1. Using document.querySelector and .value (See this this answer).
  2. Since the inputs are empty when you initlize Dropzone, params should be a function that retrieve the values when you need them (e.g. click start).
params: () => ({
  firstname: document.querySelector('#firstname').value,
  lastname: document.querySelector('#lastname').value,
}),

https://jsbin.com/neteker/edit?js,output

More info about params

Related