title: Form has enctype="multipart/form-data" but Request Content-Type is application/x-www-form-urlencoded; charset=UTF-8
body: <p>I have a basic form in ASP.Net MVC4 using Html helpers.  I have an input file in the form for uploading a file which will be added to a database.  In my view model I have a property for the input file:</p>
  
  <pre><code>        public HttpPostedFileBase AssetFile { get; set; }
  </code></pre>
  
  <p>In my view I have the form helper:</p>
  
  <pre><code>@using (Html.BeginForm("Create", "Contact", FormMethod.Post, new { enctype = "multipart/form-data" }))
  </code></pre>
  
  <p>Inside my form:</p>
  
  <pre><code>@Html.TextBoxFor(model =&gt; model.AssetFile, new { @type = "file", @name = "AssetFile" })
  </code></pre>
  
  <p>Yet, when I post the form there are no files in the Request.Files.  Then I noticed that in Fiddler the Request Header has Content-Type: application/x-www-form-urlencoded; charset=UTF-8.  I have another form with an input file and the header has Content-Type: multipart/form-data; boundary=----WebKitFormBoundaryCfBFSR0RXQRnasfb and this form works fine.  I tried doing this without Html helpers and same thing happens.  The view model itself inherits from another view model where the input file actually belongs but then I have a string property mapped to a textbox and the form is picking up this value.  There is no nested forms (on this page this is the only form) but I am having the same problem with another page that has multiple form (not nested) using multiple partial views that contain the forms like this:</p>
  
  <pre><code>@using (Html.BeginForm("Edit", "Home", FormMethod.Post, new { @enctype = "multipart/form-data" })){ @Html.Partial("EditorTemplates/_Profile", Model.InstitutionProfileInformation)}
  </code></pre>
  
  <p>Thanks in advance for any help.</p>
  
  <p>OK - Here's the weirdness.  Since they're (the original coder(s)) using partial views they ajaxified this thing.  When the partial view (with the form) is rendered:</p>
  
  <pre><code>    var loadContactDiv = function (e) {
      isChanged = false;
      var url = e.href;
      $("#Contacts").load(url, function (response, status, xhr) {
          if (status == "error") {
              var msg = "Sorry but there was an error: ";
          }
  
          $("#Contacts").find('form').submit(divSubmitHandler).change(function () {
              isChanged = true;
          });
  
          $("#ReturnButton").click(function () {
              loadContacts();
          });
      });
      return false;
  };
  </code></pre>
  
  <p>Then when the user click the submit button:</p>
  
  <pre><code>    var divSubmitHandler = function () {
      var form = $("#Contacts").find('form');
      var test = form.serialize();
  
      debugger;
      $.ajax({
          url: (form).attr('action'),
          data: form.serialize(),
          type: "POST",
          success: function (data) {
              if (data == "") {
                  loadContacts();
              } else {
                  $("#Contacts").html(data);
  
                  $("#Contacts").find('form').submit(divSubmitHandler).change(function () {
                      isChanged = true;
                  });
                  $("#ReturnButton").click(function (e) {
                      loadContacts();
                  });
              }
          }
      });
  
      return false;
  };
  </code></pre>
  
  <p>Still stuck: <a href="http://prntscr.com/20v2cp" rel="nofollow">http://prntscr.com/20v2cp</a></p>