Dynamic Form with multiple dropzone.js

Question

I am creating a servlet application with jsp that has a form with "objects". Each object has multiple input fields and a image upload zone, I picked dropzone.js for the job. The user can add as many objects as he wants and this is done dynamically with javascript. When you first load the form there already is a object that is coded within the jsp page.

I have managed to code the input boxes, but the image upload part is giving me a hard time and I can't make it work. My javascript knowledge is low and I am having a hard time understanding how i should connect all the dropzones with a servlet.

What should my javascript look like in order to have all the dropzones working properly?

Another question is if i should do every dropzone with AJAX in order to have the images already uploaded when the form is submitted (I'm thinking this because there can be multiple objects with multiple pictures).

Anyways here is what I have so far:

JSP/HTML

  <div class="form-group">
  <div class="dropzone" id="image-upload">
    <div class="dz-default dz-message file-dropzone text-center well col-sm-12">
      <span class="glyphicon glyphicon-paperclip"></span> <span>
                                To attach files, drag and drop here</span><br> <span>OR</span><br>
      <span>Just Click</span>
    </div>

    <!-- this is were the previews should be shown. -->
    <div class="dropzone-previews"></div>
  </div>
</div>
</div>
</form>
<div class="text-center">
  <button type="submit" class="btn btn-lg btn-primary" form="primaryform" id="submit-all">Create PDF</button>
</div>

JAVASCRIPT

   Dropzone.options.imageUpload = {
        url: "/generated.jsp",
        autoProcessQueue: false,
        uploadMultiple: true,
        parallelUploads: 100,
        maxFiles: 100,
        acceptedFiles: "image/*",

        init: function () {

            var submitButton = document.querySelector("#submit-all");
            var wrapperThis = this;

            submitButton.addEventListener("click", function () {
                wrapperThis.processQueue();
            });

            this.on("addedfile", function (file) {

                // Create the remove button
                var removeButton = Dropzone.createElement("<button class='btn btn-lg dark'>Remove File</button>");

                // Listen to the click event
                removeButton.addEventListener("click", function (e) {
                    // Make sure the button click doesn't submit the form:
                    e.preventDefault();
                    e.stopPropagation();


                    wrapperThis.removeFile(file);
                });

                // Add the button to the file preview element.
                file.previewElement.appendChild(removeButton);
            });
        }
    };

Thanks in advance!