title: Dropzone.js - Multiple file upload without duplicated response
body: <p>TLDR;</p>
  
  <p>I managed to simplify my question after a good night's sleep. Here's the simpler question.</p>
  
  <p>I want to upload N files to a server, which would process them together and return a single response (e.g. Total foobars in all files combined = XYZ).</p>
  
  <p>What's the best way to send this single response back to the client?</p>
  
  <p>Thanks.</p>
  
  <p>&amp;</p>
  
  <p>Below is the old question, left behind as a lesson for me.</p>
  
  <hr>
  
  <p>I'm using Dropzone.js to build D&amp;D functionality into my app.</p>
  
  <p>Please note: I know there are a couple of questions already that discuss multifile uploads. But they are different from my question. They talk about how to get a single callback call instead of multiple ones. </p>
  
  <p>My issue is related to the situation where I drag and drop multiple files into the dropzone, but am seeing the single server response being duplicated multiple times. Here is my config:</p>
  
  <pre><code>Dropzone.options.inner = {
      init: function() {
        this.on("dragenter", function(e) {
          $('#inner').addClass('drag-over');
          //// TODO - find out WTF this isn't working (low priority)
        }),
  
        this.on("completemultiple", function(file, resp) {
          //// TODO
        })
      },
  
      url: "php/...upload...php",
  
      timeout: 120000, // 2m
      uploadMultiple: true,
      autoProcessQueue: false,
      clickable: false,
    };
  
    //// ... Some other stuff 
    //// ...
  
    $(document).ready(function() {
      $('#inner').click(function() {
        Dropzone.forElement('.dropzone').processQueue();
      });
  </code></pre>
  
  <p>In the beginning I intercepted the "complete" event, rather than "completemultiple". That resulted in its handler being invoked multiple separate times (once for each file), even though the server-side php was only being invoked once. Each invocation returned a duplicate copy of the same server-side message.</p>
  
  <p>I didn't want that, so I changed it to "completemultiple", and now I can confirm that the handler only gets called once with an array of files, but the single server response is now buried within each file object returned - each has a duplicate copy of the exact same response. </p>
  
  <p>It doesn't matter ultimately because it is the same message, after all. But the whole esthetics of the thing now seems off which indicates to me I'm doing something wrong - the response seems to indicate two independent uploads, but they were part of a single invocation of the server side php. Why make the client "believe" there were two separate upload requests when the server-side script only has one opportunity to respond (i.e. The php is not sending back different messages for each file - should it? And if so, what's the best way to do it?)</p>
  
  <p>How can I make it so that if I have a scenario in which it's all-or-none, I get a single response back from the php script?</p>
  
  <p>This is especially important to me because my server response will contain the status and some other data. The script does more than simply receiving the uploaded files (hence the longer timeout).</p>
  
  <p>I thought maybe that's a sign that I should separate the uploading part from the processing part and trigger the processing once the upload is complete. </p>
  
  <p>But that means that the server side upload script can't clean up after itself. It needs to persist data beyond its own life. Also it now needs to return a handle to this data back to the client, which would dispatch the server-side processor in a different ajax call passing it this handle - and the subsequent call needs to clean up the files left by the uploader after it is done processing them.</p>
  
  <p>This seems the less elegant solution. Is this something I just need to get used to? Or is there a better way of accomplishing what I want?</p>
  
  <p>Also, any other free tips and hints from the front-end gurus in my network will be gratefully accepted.</p>
  
  <p>Thanks.</p>
  
  <p>&amp;</p>