title: ASP.NET MVC HttpPostedFIleBase is null
body: <p>I have a <code>@Html.BeginForm</code> in my view which is suppose to allow the user to upload an image and add some details about the image.</p>
  
  <p>Here is the View:</p>
  
  <pre><code>@Html.BeginForm("SaveImage", "Listing", FormMethod.Post, new { enctype = "multipart/form-data" }))) {
  &lt;div id="modalAddImage" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"&gt;
      &lt;div class="modal-header"&gt;
      &lt;button type="button" class="close" data-dismiss="modal" aria-hidden="true"&gt;×&lt;/button&gt;
                      &lt;h3 id="myModalLabel"&gt;Modal header&lt;/h3&gt;
      &lt;/div&gt;
      &lt;div class="modal-body"&gt;
      &lt;p&gt;Image&lt;/p&gt;
      &lt;input type="file" name="file"&gt;&lt;/input&gt;
  
       @foreach (Image translation in Model.Listing.Images)
       {
          @Html.TextBoxFor(m =&gt; m.Description)
       }
       &lt;/div&gt;
       &lt;div class="modal-footer"&gt;
       &lt;button class="btn" data-dismiss="modal" aria-hidden="true"&gt;Close&lt;/button&gt;
       &lt;button class="btn btn-primary"&gt;Save changes&lt;/button&gt;
   &lt;/div&gt;
  &lt;/div&gt;
  }
  </code></pre>
  
  <p>I have a different <code>@Html.BeginForm</code> right before this one which is for something else.</p>
  
  <p>This is my controller:</p>
  
  <pre><code>    [HttpPost]
      public ActionResult SaveImage(HttpPostedFileBase file)
      {
          if (file!= null &amp;&amp; file.ContentLength &gt; 0)
          {
              var fileName = Path.GetFileName(file.FileName);
              var path = Path.Combine(Server.MapPath("~/App_Data/uploads"), fileName);
              file.SaveAs(path);
          }
  
          return View("Maintain");
      }
  </code></pre>
  
  <p>When I put a break-point in <code>SaveImage</code>, file is always null. I have tried to upload both big and small images.</p>
  
  <p>Can anyone see where I am going horribly wrong?</p>