Validation Server Controls in Web Forms

Article Description

When working with Web applications, developers need to write two separate codes using Java Script and VB Script to validate user inputs. Using two separate codes is not only a resource consuming (time and money) process, it also degrades the performance of applications. In this article we are going to see, how we can reduce the programmers effort on coding, reducing the execution process time and simplify the code handling and less number of lines in the coding.

Validation Server Controls

In ASP.NET the following server controls are available to validate the user inputs with less hazels in the coding.

1. CompareValidator Control
2. CustomValidator Control
3. RangeValidator Control
4. RegularExpressionValidator Control
5. RequiredFieldValidator Control
6. ValidationSummary Control

CompareValidator Control

Syntax:

<asp:CompareValidator
id="ProgrammaticID"
ControlToValidate="Programmatic ID of Server Control to Validate"
ValueToCompare="value"ControlToCompare="value" Type="DataType" Operator="Operator Value" ErrorMessage="Message to display in ValidationSummary control"Text="Message to display in control" ForeColor="value"BackColor="value" runat="server" >
</asp:CompareValidator>

In this control we can validate and compare two input variables based on their data type using the comparison operators like equal to, not equal to, greater than, les than etc. We can use this validation control in password verification, compare the user input with the value from the relational database.

CustomValidator Control

Syntax: <asp:CustomValidator id="ProgrammaticID" ControlToValidate="programmatic ID of Server Control to Validate"
ClientValidationFunction="ClientValidateID"OnServerValidate="ServerValidateID"
ErrorMessage="Message to display in ValidationSummary control"
Text="Message to display in control" ForeColor="value" BackColor="value" runat="server" >
</asp:CustomValidator>

In this server control, we can validate the user input passes to the customized logic. This logic may vary depends upon the requirements. For example: In on-line banking the amount transfer transferred by the user is valid against his available balance (it should be less than his balance. If it is not, then ErrorMessage text will be displayed on your web form)

RangeValidator Control

Syntax:
<asp:RangeValidator id="ProgrammaticID"
ControlToValidate="ProgrammaticID of control to validate" MinimumValue="value"
MaximumValue="value" Type="DataType" ErrorMessage="Message to display in ValidationSummary control"Text="Message to display in control"ForeColor="value" BackColor="value" runat="server" >
</asp:RangeValidator>

In this server control, we can check the number range between maximum and minimum values against the user input. For example: Age, year validation.

RegularExpressionValidator Control

Syntax:
<asp:RegularExpressionValidator id="ProgrammaticID" ControlToValidate="ProgrammaticID of control to validate" ValidationExpression="expression" ErrorMessage="Message to display in ValidationSummary control"Text="Message to display in control"ForeColor="value" BackColor="value"runat="server" >
</asp: RegularExpressionValidator>

In this server control, we can validate the postcode, telephone number etc by using the regular expressions. These expressions may have special characters like matching patterns in the Unix commands.

RequiredFieldValidator Control

Syntax:
<asp:RequiredFieldValidator id="ProgrammaticID" ControlToValidate="ProgrammaticID of control to validate" InitialValue="value"ErrorMessage="Message to display in ValidationSummary control"Text="Message to display in control"ForeColor="value" BackColor="value" runat="server" >
</asp:RequiredFieldValidator>

In this server control, we can validate the mandatory field validations in the user account details. If the mandatory field is blank or null the error message will be displayed in the web form.

ValidationSummary Control

Syntax:
<asp:ValidationSummary id="programmaticID"
DisplayMode="BulletList | List | SingleParagraph" EnableClientScript="true | false"
ShowSummary="true | false"ShowMessageBox="true | false" HeaderText="TextToDisplayAsSummaryTitle"runat="server"/>
</asp:ValidationSummary >

In this server control, it will summarize the validation results on the web form and will displayed with the bulleted list.

The below example shows that in User Account Details web form using the above validation server controls to validate user input details.

Source Code:
<%@ Page Language="C#" %>
<html>
<head>
<script runat="server">
void ValidateBtn_Click(Object sender, EventArgs e)
{
if (Page.IsValid)
{
zipOutput.Text = "Page is Valid!";
}
else
{
zipOutput.Text = "Page is InValid!";
}
}
</script>
</head>
<body>
<h3>User Account Details</h3>
<p>
<form runat="server" ID="Form2">
<table cellpadding="10">
<tr>
<td>
<table bgcolor="#eeeeee" cellpadding="10">
<tr>
<td colspan="3">
<asp:Label id="zipOutput" Text="Enter a 5 digit zip code" Font-Name="Verdana" Font-Size="10pt" runat="server"/>
</td>
<td>
<asp:TextBox id="TextBox1" runat="server"/>
</td>
<td>
<asp:RegularExpressionValidator id="RegularExpressionValidator1" ControlToValidate="TextBox1"ValidationExpression="\d{5}"Display="Static"
ErrorMessage="Zip code must be 5 numeric digits"runat="server"/>
</td>
</tr>
<tr>
<td colspan="3">
<b>Age:</b>
</td>
<td>
<asp:TextBox id="TextBox2" runat="server"/> </td>
<td>
<asp:RangeValidator id="Range1"ControlToValidate="TextBox2"MinimumValue="20"
MaximumValue="30"Type="Integer"Text="The value must be from 20 to 30!"
runat="server"/>
</td>
</tr>
<tr>
<td colspan="3">
<b>Credit Card Information</b>
</td>
</tr>
<tr>
<td align="right">
Card Type:
</td>
<td>
<asp:RadioButtonList id="RadioButtonList1" RepeatLayout="Flow"runat=server>
<asp:ListItem>MasterCard</asp:ListItem>
<asp:ListItem>Visa</asp:ListItem>
</asp:RadioButtonList>
</td>
<td align="middle" rowspan="1">
<asp:RequiredFieldValidator id="RequiredFieldValidator1"
ControlToValidate="RadioButtonList1"ErrorMessage="Card Type."Display="Static"
InitialValue="" Width="100%" Text="*"runat="server"/>
</td>
</tr>
<tr>
<td align="right">
Card Number:
</td>
<td>
<asp:TextBox id="TextBox3" runat="server" />
</td>
<td>
<asp:RequiredFieldValidator id="RequiredFieldValidator2"
ControlToValidate="TextBox3" ErrorMessage="Card Number. "Display="Static"
Width="100%"Text="*" runat=server/>
</td>
</tr>
<tr>
<td></td>
<td>
<asp:Button id="Button1" Text="Validate"OnClick="ValidateBtn_Click"
runat=server />
</td>
<td></td>
</tr>
</table>
</td>
<td valign=top>
<table cellpadding="20">
<tr>
<td>
<asp:ValidationSummary id="valSum" DisplayMode="BulletList"HeaderText="You
must enter a value in the following fields:"runat="server"/>
</td>
</tr>
</table>
</td>
</tr>
</table>
</form>
</body>
</html>