I'm using data annotations in my ASP.NET MVC4 project to perform client-side validation on email and phone fields. Email is successfully validating in the client but phone doesn't - it allows me to enter invalid characters and only warns me on submission of the form (rather than immediately after the character is typed)
In the model:
[Required(ErrorMessage = "Email is required")]
[DataType(DataType.EmailAddress)]
[EmailAddress]
[Display(Name = "Email")]
public string Email{ get; set; }
[Required(ErrorMessage = "Mobile is required")]
[DataType(DataType.PhoneNumber)]
[Phone]
[Display(Name = "Mobile number")]
public string Mobile { get; set; }
In the view I believe I'm including the correct script references:
<script type="text/javascript" src="~/Scripts/jquery.validate.min.js" ></script
<script type="text/javascript" src="~/Scripts/jquery.validate.unobtrusive.min.js" ></script>
..and using html helpers (I'm using TextBoxFor rather than EditorFor as I'm applying class attributes which I have omitted here for clarity)
@Html.LabelFor(model => model.Email)
@Html.ValidationMessageFor(model => model.Email)
@Html.TextBoxFor(model => model.Email, new { @type = "email" })
@Html.LabelFor(model => model.Mobile)
@Html.ValidationMessageFor(model => model.Mobile)
@Html.TextBoxFor(model => model.Mobile, new { @type = "phone" })
What am I missing?