title: Blueimp multi file uploader with ASP.NET MVC 3
body: <p>I am trying to add <a href="http://aquantum-demo.appspot.com/file-upload" rel="nofollow noreferrer">blueimp File Upload</a> to a MVC application and I'm having problems with receiving the files in the post action(im going for the multi file upload functionality).Can someone please help me figure this out?  </p>
  
  <p>In my view i have the following code:</p>
  
  <pre><code>&lt;form id="file_upload" enctype="multipart/form-data" action="Home/SaveFile" method="post"&gt;    
     &lt;input type="file" name="file" multiple="true"/&gt;
     &lt;button&gt;Upload&lt;/button&gt;
     &lt;div&gt;Upload files&lt;/div&gt;        
  &lt;/form&gt;
  &lt;br /&gt;
  ###############################
  &lt;table id="files"&gt;
  &lt;/table&gt;
  
  &lt;button id="start_uploads"&gt;Start uploads&lt;/button&gt;
  &lt;button id="cancel_uploads"&gt;Cancel uploads&lt;/button&gt;
  </code></pre>
  
  <p>The JQuery code for blueimp File Upload is the following:</p>
  
  <pre><code>$(document).ready(function () {
  
          $('#file_upload').fileUploadUI({
              uploadTable: $('#files'),
              downloadTable: $('#files'),
              buildUploadRow: function (files, index) {
                  return $('&lt;tr&gt;&lt;td class="file_upload_preview"&gt;&lt;\/td&gt;' +
                          '&lt;td&gt;' + files[index].name + '&lt;\/td&gt;' +
                          '&lt;td class="file_upload_progress"&gt;&lt;div&gt;&lt;\/div&gt;&lt;\/td&gt;' +
                          '&lt;td class="file_upload_start"&gt;' +
                          '&lt;button class="ui-state-default ui-corner-all" title="Start Upload"&gt;' +
                          '&lt;span class="ui-icon ui-icon-circle-arrow-e"&gt;Start Upload&lt;\/span&gt;' +
                          '&lt;\/button&gt;&lt;\/td&gt;' +
                          '&lt;td class="file_upload_cancel"&gt;' +
                          '&lt;button class="ui-state-default ui-corner-all" title="Cancel"&gt;' +
                          '&lt;span class="ui-icon ui-icon-cancel"&gt;Cancel&lt;\/span&gt;' +
                          '&lt;\/button&gt;&lt;\/td&gt;&lt;\/tr&gt;');
              },
              buildDownloadRow: function (file) {
                  return $('&lt;tr&gt;&lt;td&gt;' + file.name + '&lt;\/td&gt;&lt;\/tr&gt;');
              },
              beforeSend: function (event, files, index, xhr, handler, callBack) {
                  handler.uploadRow.find('.file_upload_start button').click(callBack);
              }
          });
          $('#start_uploads').click(function () {
              $('.file_upload_start button').click();
          });
          $('#cancel_uploads').click(function () {
              $('.file_upload_cancel button').click();
          });
      });
  </code></pre>
  
  <p>And inside the controller the following action method:</p>
  
  <pre><code>[AcceptVerbs(HttpVerbs.Post)]
      public ActionResult SaveFile(IEnumerable&lt;HttpPostedFileBase&gt; files)
      {
          foreach (HttpPostedFileBase file in files)
          {
              //some file upload magic                
          }
          return View("MyView");
      }
  </code></pre>
  
  <p>I am using MVC 3.</p>
  
  <p>In the action method, if the argument is of type IEnumerable it receives null and if the argument is of type HttpPostedFileBase it receives the files in a strange way and the action method doesn't work how it's suppose to.  </p>
  
  <p>Any kind of help is much appreciated, thanks.</p>
  
  <p>Cheers!</p>