Mvc doesnt validate input type file - asp.net-mvc

Question

I am using strongly type view model for my view , Validation works for all the text fields but it doesnt work for fileupload , below is the code:
<div class="bg-content-inner">
<% Html.EnableClientValidation(); %>
<% using (Html.BeginForm("Create", "Track", FormMethod.Post, new { enctype = "multipart/form-data" }))
{ %>
<%: Html.ValidationSummary("Please Correct the errors and try again")%>
<table cellpadding="2" cellspacing="2" border="0">
<tr>
<td style="width:100px;">
<div class="editor-label">
<%: Html.LabelFor(model => model.Name) %>
</div>
</td>
<td colspan="2">
<div class="editor-field">
<%: Html.TextBoxFor(model => model.Name, new { style = "width:300px;" })%>
<%: Html.ValidationMessageFor(model => model.Name,"Circuit Name Required") %>
</div>
</td>
</tr>
<tr>
<td>
Main Image
</td>
<td>
<div class="editor-field">
<input type="file" name="files" id="file1" style="color:White" />
<%:Html.ValidationMessageFor(model => model.ImageLarge,"Required") %>
</div>
</td>
</tr>
<tr>
<td>
Detail Image
</td>
<td>
<div class="editor-field">
<input type="file" name="files" id="file2" style="color:White" />
<%:Html.ValidationMessageFor(model => model.ImageSmall,"Required") %>
</div>
</td>
</tr>
<tr></table>

Answer 1

If you are using unobtrusive validation, the HtmlHelpers will insert some data-XXXX attributes to enable client-side validation... since MVC does not have a HtmlHelper for INPUT[FILE] and you have to manually insert the INPUT element... you can also add the data-XXXX attributes yourself... them and the client-side validation will work (well... at least in FF and Chrome... I have not tested it in others)... so...
replace:
<input type="file" name="files" id="file2" style="color:White" />
with:
<input type="file" name="files" id="file2" style="color:White" data-val="true" data-val-required="File is required" />
Hope it helps you.

Answer 2

I think the validation message is looking for ImageLarge and ImageSmall to validate against.
If you change the name and id attributes to match the model image names does it work? e.g
name="ImageLarge" id="ImageLarge"

Answer 3

You can't client-side validate an <input type="file" />; it must be POSTed to the server and the upload examined, there just isn't a way around this.

Answer 4

May be AjaxSubmit helps you.