title: Disabling auto-uploading on Blueimp jQuery File Upload
body: <p>I am using blueint jquery.fileupload plugin to upload files using asp.net</p>
  
  <p>I have a situation where I have a page to allow the user to select a category (dropdownlistbox), a title (for the uploaded file - TextBox) and a file input (handled by the plugin).</p>
  
  <p>the plugin:
  <a href="https://github.com/i-e-b/jQueryFileUpload.Net" rel="noreferrer">https://github.com/i-e-b/jQueryFileUpload.Net</a></p>
  
  <p>javascript/jquery:</p>
  
  <pre><code> $('#fileup').fileupload({
                      replaceFileInput: false,
                      formData: function (form) {
                          return [{ name: 'dcat', value: $('#ddlCats').val() }, { name: 'title', value: $('#txtTitle').val()}];
                      },
                      dataType: 'json',
                      url: '/_handlers/FileHandler.ashx',
                      add: function (e, data) {
                          var valid = true;
                          var re = /^.+\.((doc)|(xls)|(xlsx)|(docx)|(pdf)|(pts))$/i;
                          $.each(data.files, function (index, file) {
                              if (!re.test(file.name)) {
                                  $('#uploaded').html('This file type is not supported');
                                  valid = false;
                              }
                          });
                          if (valid)
                              data.submit();
                      },
                      done: function (e, data) {
                          $.each(data.result, function (index, file) {
                              $('#uploaded').html(file);
                          });
                          GetFiles($('#ddlCats').val())
                      },
                      error: function () {
                          alert('An error occured while uploading the document.');
                      }
                  });
  </code></pre>
  
  <p>html:</p>
  
  <pre><code>&lt;div id="fUpload"&gt;
  &lt;span style="font-weight:bold;"&gt;Yeni Belge:&lt;/span&gt;&lt;br /&gt;
      &lt;table class="ktoeos"&gt;
          &lt;tr&gt;
              &lt;td&gt;Category:&lt;/td&gt;
              &lt;td&gt; &lt;select id="ddlCats"&gt;&lt;/select&gt;&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
              &lt;td&gt;Document Description:&lt;/td&gt;
              &lt;td&gt;&lt;input type="text" id="txtTitle" /&gt;&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
              &lt;td&gt;Select Document:&lt;/td&gt;
              &lt;td&gt;&lt;input type="file" name="file" id="fileup" /&gt;&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
             &lt;td colspan="2"&gt;&lt;input type="submit" id="btnSubmit" value="Upload" /&gt;&lt;/td&gt;
          &lt;/tr&gt;
      &lt;/table&gt;
      &lt;div id="uploaded"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>My problem is, the file gets uploaded (through an http handler) straight after I select a file. I can handle it to submit other form data along with it however, I want to fire this event on the button submit as I need to carry out some validation. Also the user might want to select a file first and then fill the other parts of the form, which in this case he/she cannot do, due to the form being submitted before he/she can do that.</p>
  
  <p>Since I am not a very good javascript programmer, I have no idea if this functionality is already available (which probably is) in the .js files available with the plugin. Any ideas what I need to change or do?</p>