Uploaded byKrunal Trivedi
MVC 3-RAZOR Validation
The document outlines the implementation of MVC 3 Razor validations in a web application, detailing the creation of a customer class, validation logic, and the use of client-side and server-side validation techniques. It explains how unobtrusive validation enhances user experience by separating validation logic from HTML and ensuring that validation occurs even if JavaScript is disabled. Additional information includes best practices for JavaScript library management and the reliance on HTML attributes for defining validation rules.
EducationâŚ
More Related Content
Similar to MVC 3-RAZOR Validation
![Java Web Programming [8/9] : JSF and AJAX](https://cdn.slidesharecdn.com/ss_thumbnails/javaweb-module8-130106070914-phpapp02-thumbnail.jpg?width=600ounds&width=560&fit=bounds)
MVC 3-RAZOR Validation
- 1. MVC 3-RAZOR-Validations Krunal Trivedi CorporateTrainer DotNet,Silverlight,SPS 2010, SharePoint 15,MVC , Windows Phone , Windows 8 MCT S For .NET Web Technology MCTS For SharePoint Server 2010 Development Co-Founder at Aavid Technologies Email:krunaltrivedi@live.in Contact : 09998472789
- 2. MVC 3 WebApplicaiton
- 4.
- 5.
- 6. Right Click onIndex Action-ď Create View Strongly-Typed View
- 7. Modify CustomerClass asshown below⌠We are going to implement Validaiton
- 8. Create one directoryď Utilityď AddNew Classď AgeValidation.cs
- 9. Prepare Class logicâŚthatis going to make sure age greater than 21
- 10. Open CustomerController Create NewActionď DisplayCustomer
- 11. Right Click onDisplayCustomerď Add Viewď Strongly-Typed View
- 12. Run the application. Weare not getting proper validation messagesâŚ
- 13. Modify Your Index.cshtmlview as shown belowâŚ
- 14. Now , RunApplication. We get proper validation messages.
- 17. ⢠Direct Approachto Validation is.. â You can Directly right down validation logic inside Controller Action⌠â Letâs tryâŚ
- 18. Modify CustomerClass.cs asshown belowâŚ.Comment out validations attributes for FirstName and LastName
- 19. Modify DisplayCustomer Actionof CustomerController
- 20. Run Application⌠For FirstNameand LastName we are getting validation messages from DisplayCustomer Action.
- 21. We will use@Html.ValidationSummary(true) It is used when there is some problem arising from an interaction between two or more property values.
- 22. Modify Display CustomerAction as shown below.
- 23.
- 24. ⢠In thiscase , it is not possible to display Property-Level validation messages. ⢠Suppose , we want to display both Property-Level validation messages and model-level validation messages. ⢠Letâs tryâŚ
- 25. Modify your Index.cshtmlas shown belowâŚ
- 26.
- 27. Modify output..and checkit againâŚ
- 29. Client-Side Validation ⢠TheMVC Framework supports unobtrusive client-side validation. ⢠The term unobtrusive means that validation rules are expressed using attributes added to the HTML elements that we generate. ⢠These are interpreted by a JavaScript library that is included as part of the MVC Framework .
- 30. Unobstrusive meansâŚ.3 things â˘The first is that the JavaScript that performs the validation is kept separate from the HTML elements, which means we donât have to include client-side validation logic into our views and that the HTML we generate is easier to read.
- 31. ⢠The secondcharacteristic is that the validation is performed using progressive enhancement. ⢠This means that if a userâs browser doesnât support all of the JavaScript features we require for client-side validation, then the validation will be performed using simpler techniques. ⢠For example, if the user has disabled JavaScript, then server- side validation will be seamlessly performed without the user being otherwise penalized (no unpleasant error messages or special steps to take).
- 32. ⢠The thirdcharacteristic is a set of best practices to mitigate the effect of browser inconsistencies and behaviors.
- 33. Enabling-Disabling Client-Side Validation Openweb.config and modify appsetting as shown below.
- 34. Referencing the JavaScriptLibraries Required for Client-Side Validation Open _Layout.cshtml and observer the libraries added
- 35. From Scriptsď add following.js file to _Layout.cshtml
- 36. ⢠Thatâs it⌠â˘Run the application⌠⢠It works Right???
- 37. The order inwhich the jQuery files are referenced is significant. If you change the order, you will find that the client validation is not performed. ⢠The scripts folder contains two versions of each JavaScript library. ⢠The versions whose name ends with min.js are the minimized versions, meaning that all of the whitespace, comments, and other nonessential content have been removed to reduce the size of the library file. ⢠The minimized files can be much smaller and are typically used in production to reduce the amount of data that the client downloads. ⢠During development, the unminimized versions are typically used so that the JavaScript can be debugged (or just read) if problems arise.
- 38. We requiredâŚone morelibrary..that is really importantâŚ
- 39. Run application⌠Observer theclient-side validation.
- 40. Client and Serverside Validation messages.
- 42. How it works!!! ⢠One of the benefits of using the MVC Framework client-side validation feature is that we donât have to write any JavaScript. Instead, the validation rules are expressed using HTML attributes. Here is the ⢠HTML that is rendered by the Html.EditorFor helper for the ClientName property when client-side ⢠validation is disabled:
- 43. Disable the Client-SideValidation as shown belowâŚ. Run Application.
- 44. Generate some validationmessage.
- 47. Enable Client-side validation.. Bydefault it is enabled..so need to write following line.. If you writeâŚ..CoolâŚno issuesâŚ
- 48. Now generate thevalidation and check the page source.
- 49. ⢠The MVCclient-side validation support doesnât generate any JavaScript or JSON data to direct the validation process; like much of the rest of the MVC Framework, we rely on convention. ⢠The first attribute that was added is data-val. The jQuery Validation library identifies those fields that require validation by looking for this attribute. ⢠Individual validation rules are specified using an attribute in the form data-val-<name>, where name is the rule to be applied. So, for example, the Required attribute
- 50. ⢠The interpretationof the required and length validation rules is provided by the jQuery Validation library, on which the MVC client validation features are built.
- 51. ⢠The MVCclient-validation features are built on top of the jQuery Validation library, and if you prefer, you can use the Validation library directly and ignore the MVC features.
- 52.