title: Posting files and model to controller in ASP.NET Core MVC6
body: <p>I'm migrating a project from ASP.NET RC1 to ASP.NET Core 1.0.</p>
  
  <p>I have a view that allows users to upload one of more files, which I post using Jquery Ajax. I also serialize and post some settings within the same post.</p>
  
  <p>The following all worked in RC1 (and pre-asp.net core):</p>
  
  <p>Js:</p>
  
  <pre><code>    $('#submit').click(function () {      
          var postData = $('#fields :input').serializeArray();
          var fileSelect = document.getElementById('file-select');
          var files = fileSelect.files;
  
          var data = new FormData();
          for (var i = 0; i &lt; files.length; i++) {
              data.append('file' + i, files[i]);
          }
          $.each(postData, function (key, input) {
              data.append(input.name, input.value);
          });
          var url = '/ajax/uploadfile';
          $.ajax({
              url: url,
              type: "POST",
              contentType: false,
              processData: false,
              cache: false,
              data: data,
              success: function (result) {
                  alert('success');                   
              },
              error: function () {
                  alert('error'); 
              }
          });
      });
  </code></pre>
  
  <p>Controller:</p>
  
  <pre><code>  public IActionResult UploadFile(UploadFileModel model)
      {
          var result = new JsonResultData();
          try
          {
              if (Request.Form.Files.Count &gt; 0)
              {
                  IFormFile file = Request.Form.Files[0];
                  //etc
               }
          }
       }
  </code></pre>
  
  <p><strong>So the above does not work anymore, no file uploaded and no model bound</strong>. 
  I managed to fix half the issues so now I can get the model to bind with the following code. However, the controller will still give me an exception on the <code>Request.Files</code>. I added the 'headers' property, and I used <code>serializeObject</code> (custom method). In the controller I added <code>FromBody</code>.</p>
  
  <p>Js:</p>
  
  <pre><code> $('#submit').click(function () {      
          var postData = $('#fields :input').serializeArray();
          var fileSelect = document.getElementById('file-select');
          var files = fileSelect.files;
  
          var data = new FormData();
          for (var i = 0; i &lt; files.length; i++) {
              data.append('file' + i, files[i]);
          }
          $.each(postData, function (key, input) {
              data.append(input.name, input.value);
          });
          var url = '/ajax/uploadfile';
          $.ajax({
              url: url,
              type: "POST",
              headers: {
                  'Accept': 'application/json',
                  'Content-Type': 'application/json'
              },
              processData: false,
              cache: false,
              data: serializeAndStingifyArray(data),
              success: function (result) {
                  alert('success');                   
              },
              error: function () {
                  alert('error'); 
              }
          });
      });
  
      function serializeAndStingifyArray(array) {
      var o = {};
      var a = array;
      $.each(a, function () {
          if (o[this.name] !== undefined) {
              if (!o[this.name].push) {
                  o[this.name] = [o[this.name]];
              }
              o[this.name].push(this.value || '');
          } else {
              o[this.name] = this.value || '';
          }
      });
      return JSON.stringify(o);
  };
  </code></pre>
  
  <p>Controller:</p>
  
  <pre><code>    [HttpPost]
      public IActionResult UploadFile([FromBody]UploadFileModel model)
      {
          var result = new JsonResultData();
          try
          {
              if (Request.Form.Files.Count &gt; 0)
              {
                  IFormFile file = Request.Form.Files[0];
                  //etc
               }
           }
         }
  </code></pre>
  
  <p>html:</p>
  
  <pre><code>    &lt;div id="file-list"&gt;
      &lt;input type="file" name="file" class="file-select" accept="application/pdf,application"&gt;
      &lt;input type="file" name="file" class="file-select"           accept="application/pdf,application" /&gt;
      &lt;/div&gt;
  </code></pre>