Data validation not working in view (DataAnnotations) - asp.net-mvc

Question

I'm having trouble getting data validation working in my view.
I believe 'AssetName' should show an error message if a user tabs into the textbox and doesn't put any data in but no message is shown when the textbox loses focus.
Model:
using System.ComponentModel.DataAnnotations;
namespace ACore.Models
{
public class AssetForm
{
[Required]
public string AssetName { get; set; }
public string Address1 { get; set; }
public string Address2 { get; set; }
public string City { get; set; }
[UIHint("StatesEditor")]
public State State { get; set; }
[Required(ErrorMessage = "TEST")]
public string ZipCode { get; set; }
[Required]
public string Seg3Code { get; set; }
}
}
View:
#using System.Web.Optimization
#model ACore.Models.AssetForm
#using (Html.BeginForm(null, null, FormMethod.Post, new { id = "frmAsset" }))
{
<div class="tempStyle">
<div class="editor-label fl">
#*#Html.LabelFor(model => model.AssetName)*#
Asset Name:
</div>
<div class="editor-field">
#Html.EditorFor(model => model.AssetName)
#Html.ValidationMessageFor(model => model.AssetName)
</div>
</div>
<div class="tempStyle">
<div class="editor-label">
Address 1:
</div>
<div class="editor-field">
#Html.EditorFor(model => model.Address1)
#Html.ValidationMessageFor(model => model.Address1)
</div>
</div>
}
Section of Web.config
<appSettings>
<add key="webpages:Version" value="2.0.0.0" />
<add key="webpages:Enabled" value="true" />
<add key="PreserveLoginUrl" value="true" />
<add key="ClientValidationEnabled" value="true" />
<add key="UnobtrusiveJavaScriptEnabled" value="true" />
</appSettings>
I ended up adding the code below but it appears that the DataAnnotations in my class have no bearing on the validation. I would prefer to control the validation through DataAnnotations:
// Validate the Maintenance and Office percentages.
var validator = $("#frmAsset").validate({
rules: {
AssetName: {
required: true
},
Seg3Code: {
required: true,
minlength: 3,
maxlength: 3
}
},
messages: {
AssetName: " ✖ Required",
Seg3Code: " ✖ Required"
},
submitHandler: function (form) {
$.ajax({
type: "POST",
url: "/Asset/Create",
data: {
},
//data: $("form").serialize(),
success: function (data) {
//console.log(data);
// Close popup window
var window = $('#AssetEditorPopUp').data("kendoWindow");
window.close();
// Refresh grid to show changes
$('#grid').data("kendoGrid").dataSource.read();
},
error: function () {
alert("There was an error editing the asset.");
}
});
return false; // to block page redirect since you're using ajax
}

Answer 1

In you BeginForm there is no posting action that is causing Submit and hence call validation. This is required unless you have some Javascript code that validate on tab-out.
In your using code block add
<input type="submit" value="textOnSubmitButton" />
and provide action and controller in BeginForm function to handle action on posting of form in the controller.
Add this in your controller
[HttpPost]
public ActionResult theAction(){
return View();
}
You will get error message on click of the submit button