Remote Attribute Sample in MVC: Day 29

In this article we will see how to apply a remote attribute in MVC.

In this sample we will check the dynamic validation of user input. We get two numbers from the end-user and check whether or not the second number is even using remote attribute. Remote attribute enables a client-side validation call to the server where the actual validation is done.

1. Create an MVC project from the "Empty" template.
   
   
2. Right-click on "Models", select "Add" >> "Class…".
   
   
   
   
3. Name the class "Calculating" and click on the "Add" button.
   
   
   
   
4. In the Calculate class create the two properties no1 and no2.
   
   
   
   
5. Now add a controller, right-click on "Controllers", select "Add" >> "Controller…".
   
   
   
   
6. Select "MVC 5 Controller - Empty" to add an empty controller.
   
   Click on the "Add" button.
   
   
   
   
7. Name the controller as in the following:
   
   
   
   
8. Now add a view. Right-click on the "Index" action method and select "Add View...".
   
   
   
   
9. Name the view "Index". Select "Empty (without model)" from the templates. Click on the "Add" button.
   
   
   
   
10. Now add two action result methods to the calc controller with the same name, one is for HttpGet and the other is for HttpPost. In the HttpPost "Create" method pass the Calculate class object as a parameter. When we press the create button it will call this HttpPost method.
    
    
    
    
11. To add a view for the "Create" method, right-click on the "Create" action result method and select "Add View...".
    
    
    
    
12. Name the view "Create". As we will show, create a form to calculate, select "Create" from the template. From the model class drop down, select "Calculate" as the model. Click on the "Add" button.
    
    
    
    
13. It will automatically create a view from the model.
    
    
    
    
14. Add the following JavaScript files in the head section of the Create.cshtml file.
    
    
    
    
15. Create an action method to validate the integer number. If the number is even then return the jsonresult object with the value true else return a jsonresult object with a message.
    
    
    
    
16. In the model add a "Remote" attribute above the No2. Pass the action name that we want to call remotely and the controller name. Here we need to pass the IsValid action method where we define a logic for No2 to check whether or not it is even and Calc as the controller name.
    
    
    
    
17. Run the project, insert an odd number in No2 and you will get the message "Only Even Number".
    
    
    

<< Compare Validator Sample in MVC: Day 28