title: Formdata is empty
body: <p>i am trying to send some jpg files using jquery but the formdata comes empty</p>
  
  <p>here is the html</p>
  
  <pre><code>&lt;input id="fileUpload" multiple="multiple" type="file"/&gt; 
   &lt;ul&gt;
   &lt;li&gt;&lt;div id="image-holder"&gt;&lt;/div&gt;&lt;/li&gt;
   &lt;li&gt;&lt;input type="submit" value="Next"&gt;&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>here is the script</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
      $('#submit').click(function() {  
  
      var files = $("[type='file']")[0].files;
  
      var formdata = new FormData();
  
      $.each(files, function(key, value)
      {
          console.log(value)
          formdata.append('file-'+key, value);
          console.log(formdata)
      });
  
      $.ajax({
              type: "POST",
              data: { 'formdata' : formdata , csrfmiddlewaretoken:'{{csrf_token}}'},
              url : "{% url 'data_entry' %}",
              cache: false,
              contentType: false,
              processData: false,
              success: function(data) {  
              },
              error: function(response, error) {
          }
      });
  }); 
  &lt;/script&gt;
  </code></pre>
  
  <p>this is what i get when i console the formdata <code>FormData {}</code> why is the formdata empty?</p>