title: Pass serialized form to Action and bind to model
body: <p>I am trying to bind model received from Ajax call but that do not work. Maybe someone could help me?</p>
  
  <p>I am calling ValidateFile Action using Ajax</p>
  
  <pre><code> $.ajax({
                      url: '@Url.Action("ValidateFile", "Converter")',
                      data: ({ file: fileName, formData: serializedForm }),
                      type: 'POST',
                      success: function (response) {
                          if (response.result) {
                          } else {
                              RemoveFile(fileName);
                          }
                      }
                  });
  </code></pre>
  
  <p>The Fiddler show such query</p>
  
  <pre><code>file=!!!SP+Design!!!.txt&amp;formData%5BEmail%5D=tomas%40mydomain.com
  </code></pre>
  
  <p>I receive data in my Action with <code>file</code> parameter populated but <code>formData.Email</code> property is  always <code>Null</code> </p>
  
  <pre><code>[HttpPost]
  public JsonResult ValidateFile(string file, UploadOptionModel formData)
  {
  }
  </code></pre>
  
  <p>My <code>UploadOptionModel</code> model</p>
  
  <pre><code>namespace PC.Models
  {
      public class UploadOptionModel
      {
          public string Email { get; set; }
      }
  }
  </code></pre>
  
  <p>Form which I am trying to serialize</p>
  
  <pre><code>@model PC.Models.UploadOptionModel
  @using (Html.BeginForm())
  {
      @Html.EditorFor(p =&gt; p.Email)
  }
  </code></pre>
  
  <p>JS Serialization function</p>
  
  <pre><code>function serializeForm() {
      var data = $("form").serializeArray();
      var formData = {};
      for (var i = 0; i &lt; data.length; i++) {
          formData[data[i].name] = data[i].value;
      }
  
      return formData;
  }
  </code></pre>