title: Using the AjaxFileUpload function
body: <p>I am using the AjaxFileUpload script and it works well, however i was trying to get it to require the pressing of a button. Right now it fires directly after you find your image to upload on the file browser. I cannot tell why and I think it is how the plugin is written, but maybe you can take a look at the logic:</p>
  
  <p>This method works: The file is uploaded right after it is submitted.</p>
  
  <pre><code>&lt;form method="post" action="" enctype="multipart/form-data"&gt;
      &lt;label&gt;File Input: &lt;input type="file" name="file" id="demo1" /&gt;&lt;/label&gt;
      &lt;div id="uploads"&gt;
  
      &lt;/div&gt;
  &lt;/form&gt;
  &lt;script type="text/javascript"&gt;
      $(document).ready(function() {
          $("#demo1").AjaxFileUpload({
  
      });
  &lt;/script&gt;
  </code></pre>
  
  <p>This method does not work. Clicking the Submit button will do nothing. However, the second time a file is browsed to (file button is clicked for a second time) it will operate in the same manner as the first method. </p>
  
  <pre><code>&lt;form method="post" action="" enctype="multipart/form-data"&gt;
      &lt;label&gt;File Input: &lt;input type="file" name="file" id="demo1" /&gt;&lt;/label&gt;
      &lt;div id="uploads"&gt;
  
      &lt;/div&gt;
  &lt;/form&gt;
  &lt;input class = "Submit" name="Submit" type="button" value="Submit" /&gt;
  &lt;script type="text/javascript"&gt;
      $(document).ready(function() {
          $(".Submit").click(function(){
              $("#demo1").AjaxFileUpload({
  
              });
          });
      });
  &lt;/script&gt;
  </code></pre>
  
  <p>I think there is a fundamental programming issue here I am missing. If you are interested in the (short) code of this plugin here is the link: <a href="https://github.com/davgothic/AjaxFileUpload/blob/master/jquery.ajaxfileupload.js" rel="nofollow">https://github.com/davgothic/AjaxFileUpload/blob/master/jquery.ajaxfileupload.js</a></p>