Sitecore Custom MVC Form with file upload, file always null

Question

I have the following model

public class VacancyDetailModel
{
    public HttpPostedFileBase Resume {get;set; }
}

This is my form.

@using (Html.BeginForm())
{
  <input type="file" name="Resume" />
  <input type="hidden" name="fhController" value="VacanciesController" />
  <input type="hidden" name="fhAction" value="VacancyDetail" />
  <button id="btn-save" class="btn btn-highlight" type="submit">Solliciteer direct empty form</button>
}

This is my controller

[HttpPost]     
//[ValidateFormHandler]       
public ActionResult VacancyDetail(VacancyDetailModel formModel)
{
    return this.View(model);
}

When I place a watch on my model, the Resume field is always null.

Answer 1

You need to define your form properly for file uploads to work. The most important part is to set enctype to multipart/form-data. Normally, you should use the standard Html.BeginForm helper:

@using (Html.BeginForm("VacancyDetail", "VacanciesController", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
  <input type="file" name="Resume" />
  <button id="btn-save" class="btn btn-highlight" type="submit">Solliciteer direct empty form</button>
}

If you, for some reason, can't use a fully parameterized Html.BeginForm, use raw HTML instead:

<form action="" method="post" enctype="multipart/form-data">
  <input type="file" name="Resume" />
  <input type="hidden" name="fhController" value="VacanciesController" />
  <input type="hidden" name="fhAction" value="VacancyDetail" />
  <button id="btn-save" class="btn btn-highlight" type="submit">Solliciteer direct empty form</button>
</form>

You can find more examples on the Haacked blog.

Answer 2

You need to specify an enctype of multipart/form-data if your form uses file input types.

You can either do this manually:

<form action="" enctype="multipart/form-data" method="POST">

Or by using the HtmlHelper, but you would need to use the particular overload that allows you to specify HTML attributes:

@using (Html.BeginForm("Action", "Controller", FormMethod.Post, new {enctype = "multipart/form-data" })) {