Data Annotations in Asp.net MVC3 Razor
1. Data annotations are attributes you can find in the System.ComponentModel.DataAnnotations namespace.
2. These attributes provide server - side validation and the framework also supports client-side validation when you use one of the attributes on a model property.
3. You can use four attributes in the Data Annotations namespace to cover common validation scenarios. There are other attributes as well to explore. We will start by looking at the Required attribute.
Watch Video
In the following sample we have used Data Annotation attributes to perform client side Validations.
Controller :
We start with the controller. Create an EmployeeController and include ActionResult method as shown below.
Model :
We create a Model class, name it as Employee. Include the properties as shown below.
We define the properties and use Data Annotation attributes to perform Client-side Validations. We have applied Required attribute to all the properties. We create a EmployeeInformationView as shown below and bind it to the model properties.
View :
We create one more view to show the result after the submission of employee information as shown below.
Application Flow after running the Application
When you run the application, the EmployeeInformation() Action method is called.
In the Action method, we create an object of Employee model class, which we pass to the view. The Employee model call looks like below.
For using Data Annotation attributes, we need to include System.ComponentModel.DataAnnotation reference. As you can see we have included two Data Annotation attributes for each property.
Display - Display property is used to give the name to the field that is bound to this property.
Required - This attribute makes the field mandatory and return the message if value for the property is not specified. After creating the Model object, it is passed to View. View looks like below.
In above view, as you can see we have used ValidationSummary() method. This validationSummary() is used to show the error message, present in the model state. When validation fails, model state is filled with the validation errors. Validation summary is use to display these validation messages.
The EmployeeInformationView renders as below.
We have two Scenarios
Scenario 1 : Validation Passes
Fill all the fields in the form as shown below.
After filling the complete form, click submit form. The EmployeeInformationSubmit() method is called as shown below.
The EmployeeInformationSubmit() method accepts Employee object, you can see the values you have entered on the screen is fill in the object.
In this method we have used ModelState.IsValid check. It checks the values entered and Annotation attributes set for each property in the model.
In this scenario, we have entered all the values, so ModelState.IsValid is true and it returns the EmployeeInformationSubmit View as shown below.
Scenario 2 : Validation Fails
In scenario 2 we will enter values in only top 3 fields and will leave other fields empty as shown below.
After filling half of the fields, press Submit button. EmployeeInformationSubmit() ActionResult method is called as shown below.
The action method accepts Model object, filled with values we entered in the form. We can see, 3 values are passed as null.
As we have used Required attribute for all the properties. The ModelState.Isvalid fails and returns the same view with error messages.
You can see, we get error messages for fields we left empty. This is the way of implementing client-side Validation.
We have seen only two properties of Data Annotation, there are more properties available to use. You can also create your custom Validation attribute suiting your need.
Data Annotation tutorial ends here !
0 comments:
Post a Comment