Search This Blog

Tuesday, September 20, 2016

Unobtrusive Validation

Unobtrusive Validation

This lightweight library allows us to add validation to our MVC views without any additional client-side coding. we only have to use attributes like RequiredAttribute and RangeAttribute and include the correct script files. 

MVC includes Unobtrusive Validation with the usage of the jQuery Validate plugin and the Unobtrusive library.

Check out the model for sample
























Model shows set up to handle server-side validation using attributes. Unobtrusive Validation allows us to take the already-existing validation attributes and use them client-side to make user experience that much cool an effective.

Scripts Required

The Unobtrusive script files are included automatically with new MVC projects in Visual Studio, but if you don't have them you can get them from.
Here is link for including Unobtrusive script files :-    Nuget Unobtrusive Package




These are the scripts files after installation of nuget package .

We need three sets of files to implement Unobtrusive validation:
  • jQuery library
  • jQuery Validate plugin
  • Unotrusive extensions to Validate


Make sure all .js file in image above added for Unobtrusive validation.we can add unobtrusive validation to any page by simply including those script files on that page.


Working of validation:

Here is the image depicting the Unobtrusive validation on .cshtml .


There are various ways to show your error message on screen, this one display just below the property.

View of controller


The POST action is super simple,we check for validation errors, and if there are any, we simply return the view.

Enable validation on  client side

We can disable client-side validation in the entire app via the Web.config file, by setting the AppSetting for ClientValidationEnabled to false.
Make sure it is set to true.



For help below sample code is attached: Download Sample





No comments:

Post a Comment