title: jQuery file upload, passing extra form data
body: <p>I want to pass an extra data to my database when people upload a pdf.</p>
  
  <p>So I got 2 radio buttons for 2 types of documents.
  How can i add the 'doctype' to my database when i upload file.
  I have read this <a href="https://github.com/blueimp/jQuery-File-Upload/wiki/How-to-submit-additional-Form-Data" rel="nofollow">https://github.com/blueimp/jQuery-File-Upload/wiki/How-to-submit-additional-Form-Data</a> this to upload, but i cant quite understand how to add the additional data</p>
  
  <p>Thanks in advance.</p>
  
  <p>This isnt all of the code, but just the part used for the upload. </p>
  
  <pre><code>    &lt;div id="filesic" class="files"&gt;&lt;/div&gt;
                                      &lt;br /&gt;
                                     &lt;input type="submit" id="submit_easy_docs" class="btn btn-success btn-lg btn-block"  value="Gem filer i easyPX"  /&gt;
                                    &lt;input type="radio" name="doctype" value="1"&gt;praktik&lt;br&gt;
                                      &lt;input type="radio" name="doctype" value="2"&gt;karakter&lt;/div&gt;
                                &lt;/div&gt;
                              &lt;/form&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
               &lt;/section&gt;
              &lt;/aside&gt;&lt;!-- /.right-side --&gt;
          &lt;/div&gt;&lt;!-- ./wrapper --&gt;
  
         &lt;script src="js/jquery-1.11.0.min.js"&gt; &lt;/script&gt;
          &lt;script src="js/jquery-ui-1.10.3.min.js" type="text/javascript"&gt;&lt;/script&gt;
          &lt;script src="js/bootstrap.min.js" type="text/javascript"&gt;&lt;/script&gt;
          &lt;script src="js/app.js" type="text/javascript"&gt;&lt;/script&gt;
            &lt;!-- The Iframe Transport is required for browsers without support for XHR file uploads --&gt;
          &lt;script src="js/jquery.iframe-transport.js"&gt;&lt;/script&gt;
          &lt;!-- The basic File Upload plugin --&gt;
          &lt;script src="js/jquery.fileupload.js"&gt;&lt;/script&gt;
  
          &lt;script&gt;
          $(document).ready(function(){
            $("#easy_upload").boxRefreshGetTestFromJour({
                      source: "ajax/easyPx_upload_fins_tests.php",
                              param: "#jourNo"
                  });
                  $.ajaxSetup ({
                      // Disable caching of AJAX responses
                      cache: false
                      });
                  $("input[type='checkbox'], input[type='radio']").iCheck({
                      checkboxClass: 'icheckbox_minimal',
                      radioClass: 'iradio_minimal'
                      });
                  $('#upload_f').hide();
                  /*$("#jourNo").keydown(function(event){
                      if(event.keyCode == 13 || event.keyCode == 9){
                          $(".Seach-btn").click();
                      }
                  });*/
  
  
  
  $('#jourNo').keypress(function (e) {
    c = e.which ? e.which : e.keyCode;
    if (c == 13) {
      $(".Seach-btn").click();
      e.preventDefault();
      return false;    //&lt;---- Add this line
    }
  });
          });
         &lt;/script&gt;
         &lt;script&gt;
          $(function () {
              'use strict';
              // Change this to the location of your server-side upload handler:
              var count = 1;
              var url = 'upload/php/',
  
              uploadButton = $('&lt;button/&gt;')
              .addClass('btn btn-primary')
              .prop('disabled', false)
              .text('Upload ...')
              .on('click', function () {
                  var $this = $(this),
                      data = $this.data();
                  $this
                      .off('click')
                      .text('Fortryd')
                      .on('click', function () {
                          $this.remove();
                          data.abort();
                      });
                  data.submit().always(function () {
                      $this.remove();
                  });
              });
              /*UPLOAD AF INDSCANNEDE DOKUMENTER*/
          $('#fileuploadic').fileupload({
              url: url,
              dataType: 'json',
              autoUpload: true,
              acceptFileTypes: /(\.|\/)(gif|jpe?g|png|pdf)$/i,
              maxFileSize: 5000000, // 5 MB
              // Enable image resizing, except for Android and Opera,
              // which actually support image resizing, but fail to
              // send Blob objects via XHR requests:
              disableImageResize: /Android(?!.*Chrome)|Opera/
                  .test(window.navigator.userAgent),
              previewMaxWidth: 100,
              previewMaxHeight: 100,
              previewCrop: true
          }).on('fileuploadadd', function (e, data) {
              //$('#progressic').show();
              $('#progress-bar-procent').css('color','#000');
              data.context = $('&lt;div/&gt;').appendTo('#filesic');
              $.each(data.files, function (index, file) {
                  var node = $('&lt;p/&gt;')
                          .append($('&lt;span/&gt;').text(file.name));
                  node.appendTo(data.context);
              });
          }).on('fileuploadprocessalways', function (e, data) {
              var index = data.index,
                  file = data.files[index],
                  node = $(data.context.children()[index]);
              if (file.preview) {
                  node
                      .prepend('&lt;br&gt;')
                      .prepend(file.preview);
              }
              if (file.error) {
                  node
                      .append('&lt;br&gt;')
                      .append($('&lt;span class="text-danger"/&gt;').text(file.error));
              }
              if (index + 1 === data.files.length) {
                  data.context.find('button')
                      .text('Upload')
                      .prop('disabled', !!data.files.error);
              }
          }).on('fileuploadprogressall', function (e, data) {
              var progress = parseInt(data.loaded / data.total * 100, 10);
              if(progress == 100) $('#progressic').hide();
              else $('#progressic').show();
             $('#progress-bar-procent').html(Math.round(progress)+'%');
             if(Math.round(progress &gt;58)){
                $('#progress-bar-procent').css('color','#fff');
             }
              $('#progressic .progress-bar').css(
                  'width',
                  progress + '%'
              );
  
          }).on('fileuploaddone', function (e, data) {
  
                var fileCon = $('#fileuploadic');
  
              $.each(data.result.files, function (index, file) {
                  if (file.url) {
  
                      var link = $('&lt;a&gt;')
                          .attr('target', '_blank')
                          .prop('href', file.url)
                          .prop('id',index);
                      $(data.context.children()[index])
                          //.append('&lt;a href="'+ file.url +'" target="_blank"&gt;'+file.name+'&lt;/a&gt;')
                          .wrap(link);
  
                          $(data.context[index]).prepend('&lt;button class="btn btn-danger btn-xs pull-right deleteimg" id="del_'+count+'" title="" data-toggle="tooltip" data-original-title="Slet"&gt;&lt;i class="fa fa-times"&gt;&lt;/i&gt;&lt;/button&gt;');
                          $(data.context[index]).append('&lt;input type="hidden" id="file_'+count +'"  name="files[]" value="upload/php/files/'+file.name+'" /&gt;');
                          $('.deleteimg').on('click', function(event){
                              if($('input[name="files[]"]').length &lt;= 2)  $('#submit_easy_docs').attr('disabled', true);
                              else $('#submit_easy_docs').attr('disabled', false);
  
                              $(this).next('a').remove();
                              $(this).next('input').remove();
                              $(this).remove();
  
                          });
  
                      //$('&lt;p/&gt;').html('&lt;input type="hidden" id="file_'+count +'"  name="files[]" value="upload/php/files/'+file.name+'" /&gt;').appendTo(fileCon);
                      count = count +1 ;
  
                  } else if (file.error) {
                      var error = $('&lt;span class="text-danger"/&gt;').text(file.error);
                      $(data.context.children()[index])
                          .append('&lt;br&gt;')
                          .append(error);
                  }
              });
              $('#submit_easy_docs').removeAttr('Disabled'); 
          });     
  
  
          }).on('fileuploadfail', function (e, data) {
              $.each(data.files, function (index, file) {
                  var error = $('&lt;span class="text-danger"/&gt;').text('File upload failed.');
                  $(data.context.children()[index])
                      .append('&lt;br&gt;')
                      .append(error);
              });
          }).prop('disabled', !$.support.fileInput)
              .parent().addClass($.support.fileInput ? undefined : 'disabled');
  
  &lt;/script&gt;
  
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>