Translate

martes, 10 de diciembre de 2013

ASP.Net: Validation

There are six components in Visual Studio you can use for user validation:

This first four are used to validate data in the client side:

  • RequiredFieldValidator: verify if any given field is present or not.
  • Rangevalidator: verify if data is between a given range.
  • RegularExpressionValidator: verify data from a mask string, for example, to verify if a strinf is a correct email.
  • Comparevalidator: used to compares two fields.
The last two are valids also to validate data in the server side in adittion to client side, which is more important, because users can disable javascript in their browsers disabling then the client side validation. So is important not to rely only in client side validation adding also server side validation.


  • CustomValidator: enables to write javaScript code associated to a validation action over a component.
  • ValidationSummary: show the errors that validator component raises.

This could be an example of a form showing a form to leave a commet in our site:


Here we have a few text boxes for we can add validator. For example, for the first one, then text box for the name I had added a RequiredFieldValidator, to avoid a missing name. The most important properties you must set for this control are:


  • ControlToValidate: The name of the control you are going to validate , the name of the text box.
  • CssClass: Class on the CSS file that define for example the color of the text when an error raises.
  • ErrorMessage: The string that shows the error.



For the second one I have added to Validation controls, a RequiredFieldValidator, configured similarliy to previous one, and also a RegularExpressionValidator. For this one is important to set the property ValidationExpression choosing between the different Expressions Visual Studio offers. In this case email expression.



For the third one, I have added another two control validations, a RequireFieldValidator, an also a CompareValidator, to compare if both eMails are equal.


For the last field, the comment I have added only a RequireFieldValidator.

And finally at the end of the form I have added a ValidationSummary  to shows all the errors made by the users during the form filling:




I have added also a CustomValidator for the telephone number, which calls a javaScript function used to verify that the telephone numer is not missing. is the same task as a RequireFieldValidator, but this time this validation is on the server side. For this you have to write a javaScript function, for the client Side, an also a C# function for the server Side. The first one is implemented in the same html file, while the C# code is implemented in the code behind file associated to the form, and into the Server_Validate event.

This is the code into the HTML with the CustomValidator, which references the two functions needed, validatePhoneNumber and CustomValidator1_ServerValidate:


This is the code also into the HTML with the javaScript function validatePhoneNumber:


This is the code behind with the function CustomValidator1_ServerValidate:


This is an example of the form showing a few errors:



No hay comentarios: