MVC File upload with Custom Validation is null - asp.net

Question

I am uploading and image and verifying its validity as per this post here:
How to validate uploaded file in ASP.NET MVC?
However, my example differs slightly because I am not just receiving the file, I am also receiving some properties for my model. However, my validator always fires, I debugged and found that my file is always null, so validator always fires back 'false'. I don't understand why, my input in view seems to be correct. Any ideas?
namespace PhotoManagement.Models
{
public class Photo
{
public virtual int PhotoId { get; set; }
public virtual int ClientId { get; set; }
public virtual string PhotoDescription { get; set; }
[ImageValidation(ErrorMessage="Please select a PNG/JPEG image smaller than 10 MB")]
[NotMapped]
public HttpPostedFileBase File { get; set; }
}
}
[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Create(Photo photo)
{
if (ModelState.IsValid)
{
db.Photos.Add(photo);
db.SaveChanges();
// File upload occurs now
var FilePath = Path.Combine(Server.MapPath("~/App_Data/" + photo.ClientId), photo.PhotoId.ToString());
photo.File.SaveAs(FilePath);
return RedirectToAction("Create");
}
else return View();
}
#using (Html.BeginForm(new { enctype = "multipart/form-data" })) {
#Html.AntiForgeryToken()
#Html.ValidationSummary(true)
<fieldset>
<legend>Photo for #Session["Name"]</legend>
<div class="editor-field">
#Html.Hidden("ClientId",(int)Session["UserId"])
</div>
<div class="editor-label">
#Html.LabelFor(model => model.PhotoDescription)
</div>
<div class="editor-field">
#Html.EditorFor(model => model.PhotoDescription)
#Html.ValidationMessageFor(model => model.PhotoDescription)
</div>
<div class="editor-label">
#Html.LabelFor(model => model.File)
</div>
<div class="editor-field">
<input type="file" name="File" id="File"/>
#Html.ValidationMessageFor(model => model.File)
</div>

Answer 1

You are using a wrong overload of the Html.BeginForm helper.
The correct call is this:
#using (Html.BeginForm(null, null, FormMethod.Post, new { enctype = "multipart/form-data" }))
{
}
You were calling:
Html.BeginForm(object routeValues)
instead of:
Html.BeginForm(
string actionName,
string controllerName,
FormMethod method,
object htmlAttributes
)
Look at the generated markup in your browser and you will see the fundamental difference.

Answer 2

Instead of
public ActionResult Create(Photo photo)
Try
public ActionResult Create(Photo photo, HttpPostedFileBase file)
EDIT: Don't forget to set the HTTP method to POST in the view:
#using (Html.BeginForm("ActionName", "ControllerName", FormMethod.Post, new { enctype = "multipart/form-data" }))

Answer 3

The file in Model will always give you null. In order to get file :
[HttpPost]
public ActionResult Create(UserViewModel model,
FormCollection formCollection, HttpPostedFileBase file){
/* Your code here */
if(file==null)
{
ModelState.AddModelError("NoFile", "Upload File");
}
}
Here HttpPostedFileBase file will give you the complete object of file uploaded. You can have check condition on the object file. Don't forget to add the below mentioned validation message in view.
#Html.ValidationMessage("NoFile")