Web Engineering-II

Using ASP.net

By
Adnan Amin
Lecturer / Software Programmer
Information and Communication Technology
( ICT Dept – NIMA )

Adnan Amin (Lecturer /

1
Programmer)
 Types of Validator Controls
0 There are six validator controls which are the following:
1. RequiredFieldValidator
2. RangeValidator
3. CompareValidator
4. RegularExpressionValidator
5. CustomValidator
6. ValidationSummary

Adnan Amin (Lecturer /

2
Programmer)
 Six validation controls with description
Validation Server Control Description  
Ensures that the user does not skip a form entry field.
RequiredFieldValidator  

Allows for comparisons between the user’s input and another

item using a comparison operator (equals, greater than, less
CompareValidator than, and so on).
 
Checks the user’s input based upon a lower- and upper level
range of numbers or characters.
RangeValidator  

Checks that the user’s entry matches a pattern defined by a

regular expression. This is a good control to use to check e-mail
RegularExpressionValidator addresses and phone numbers.
 
Checks the user’s entry using custom-coded validation logic.
CustomValidator  

Displays all the error messages from the validators in one

ValidationSummary specific spot on the page.

Adnan Amin (Lecturer /

3
Programmer)
1. The RequiredFieldValidator Control
0 The RequiredFieldValidator control simply checks to see if
something was entered into the HTML form element.

0 It is a simple validation control, but it is one of the most

frequently used.

0 You must have a RequiredFieldValidator control for each

form element on which you wish to enforce a value-
required rule where the user must enter a value (not leave
as blank).

Adnan Amin (Lecturer /

4
Programmer)
 Example: Validation using textbox control.

0 Add
Control the following
name controls and set their
Properties properties;
Values
Label Text Your Name:
Textbox1
RequiredFieldValidator1 ControlToValidate Textbox1
ErrorMessage * Your Name is required.

Your Name:
textbox1 * RequiredFieldValidator1

Codes on next slide.

Adnan Amin (Lecturer /
5
Programmer)
 Codes for Validation using textbox control.

<asp:TextBox ID="TextBox1" runat="server"> </asp:TextBox>

<asp:RequiredFieldValidator
ID="RequiredFieldValidator1"
runat="server"
ControlToValidate="TextBox1"
ErrorMessage="error message here">
</asp:RequiredFieldValidator>

 The first property to look at is the ErrorMessage property.

• This property is the value that is shown to the end user via the Web page if
the validation fails.
 The second property to look at is the ControlToValidate property.
• This property is used to make an association between this validation server
control and the ASP.NET form element (control e.g textbox) that requires the
validation. Adnan Amin (Lecturer /
6
Programmer)
 2. The CompareValidator Server Control
The CompareValidator control allows you to make
comparisons between two form elements.

For example:
 You can specify that a form element’s value must be an
integer and greater than number or less than a specified
number.
 You can also state that values must be strings, dates, or other
data types.

Adnan Amin (Lecturer /

7
Programmer)
 Add two textbox controls on to web form
Codes on next slide.

Control name Properties Values

Label Text Your Name:
0 Add the following controls and set their properties;
Textbox1
RequiredFieldValidator1 ControlToValidate Textbox1
ErrorMessage * Password is required.
CompareValidator1 ControlToValidate TextBox2
ControlToCompare Textbox1
ErrorMessage * Password is not matched

Password:
textbox1 * RequiredFieldValidator1

Re-Password:
Adnan Amin (Lecturer /
8
Programmer)
* CompareValidator1
textbox2
 Codes for CompareValidator Control.
Password:
<asp:TextBox ID="TextBox1" runat="server"> </asp:TextBox>
Re-enter password:
<asp:TextBox ID="TextBox2" runat="server"> </asp:TextBox>

<asp:CompareValidator
ID="CompareValidator1" runat="server" ControlToCompare="TextBox1“
ControlToValidate="TextBox2"
ErrorMessage="Password not matched.” Operator=”Equal">
</asp:CompareValidator>

ControlToCompare  Specify the value or html element which to be compare.

ControlToValidate  Specify the html element which to validate with above point.
Operator  Specify the kind of the comparison between above point 1 and point 2.
ErrorMessage  Specify the error message which to be display if comparison is fail.
Adnan Amin (Lecturer /
9
Programmer)
 The Operator property can take one of the following values:

Age:
0 ❑ Equal <asp:TextBox
0 ❑ NotEqual ID=”TextBox1”
Runat=”server”
0 ❑ GreaterThan MaxLength=”3”> </asp:TextBox>
0 ❑ GreaterThanEqual  
<asp:CompareValidator
0 ❑ LessThan ID=”CompareValidator1”
Runat=”server”
0 ❑ LessThanEqual
ErrorMessage=”You must enter a number”
0 ❑ DataTypeCheck ControlToValidate=”TextBox1”
Type=”Integer”
Operator=”DataTypeCheck”>
</asp:CompareValidator>

Adnan Amin (Lecturer /

10
Programmer)
 3. The RangeValidator Server Control
0 The RangeValidator control is quite similar to that of the
CompareValidator control,

0 but it makes sure that the end user value or selection provided
is between a specified range as opposed to being just greater
than or less than a specified constant.

0 For an example of this, go back to the text-box element that

asks for the age of the end user and performs a validation on
the value provided.

Adnan Amin (Lecturer /

11
Programmer)
Example: Validation using textbox control.
Codes on next slide.

0 Add
Control the following
name controls and set their
Properties properties;
Values
Label Text Age:
Textbox1
RangeValidator ControlToValidate Textbox1
ErrorMessage * Need age b/w 20-50
Type Integer
MaximumValue 20
MinimumValue 50

Age:
textbox1 * RangeValidator1
Adnan Amin (Lecturer /
12
Programmer)
 Code/Example for RangeValidator
Age:
<asp:TextBox ID=”TextBox1” Runat=”server”></asp:TextBox>

<asp:RangeValidator
ID=”RangeValidator1”
Runat=”server”
ControlToValidate=”TextBox1”
Type=”Integer”
ErrorMessage=”You must be between 30 and 40”
MaximumValue=”40”
MinimumValue=”30”>
</asp:RangeValidator>

Adnan Amin (Lecturer /

13
Programmer)
4. The RegularExpressionValidator Server Control

0 you can check a user’s input based on a pattern that you

define using a regular expression.
0 This means that you can define a structure that a user’s input
will be applied against to see if its structure matches the one
that you define.
0 The user defined structure may be zip code , telephone
number, email address and URL etc.

Adnan Amin (Lecturer /

14
Programmer)
 Validation for an e-mail address using
RegularExpression
Codes on next slide.
Control name Properties Values
Label Text Enter Your Email Address:
Textbox1
RegularExpression ControlToValidate Textbox1
ErrorMessage * Enter valid email address
ValidationExpression \w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*

Age:
* RangeValidator1
textbox1

Adnan Amin (Lecturer /

15
Programmer)
 Code/Example for RegularExpression
Enter Your Email Address:
<asp:TextBox ID=”TextBox1” Runat=”server”></asp:TextBox>

<asp:RegularExpressionValidator
ID=”RegularExpressionValidator1”
Runat=”server”
ControlToValidate=”TextBox1”
ErrorMessage=”You must enter an email address”
ValidationExpression=”\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*”>
</asp:RegularExpressionValidator>

Adnan Amin (Lecturer /

16
Programmer)
 Regular Expression Editor
0 Visual Studio 2005 makes it a
little easier to use regular
expressions by introducing the
Regular Expression Editor.
This editor provides a few
commonly used regular
expressions that you might want
to apply to your
RegularExpressionValidator.

Adnan Amin (Lecturer /

17
Programmer)
 6. The ValidationSummary Server Control
0 The ValidationSummary control is not a control that performs
validations on the content input into your Web forms.
0 Instead, this control is the reporting control, which is used by
the other validation controls on a page.
0 You can use this validation control to consolidate error
reporting for all the validation errors that occur on a page
instead of leaving this up to each and every individual
validation control.

Adnan Amin (Lecturer /

18
Programmer)
Add the following controls on web form and set the following
properties accordingly.
Controls’ Name Properties’ Name Properties’ Values.

Label1 Text First Name

Label2 Text Last Name
Button1 Text Send
ErrorMessage * First name is required.
RequiredFieldValidator1 ControlToValidate Textbox1
ValidationGroup Abc (or any other name)
ErrorMessage * Last name is required.
RequiredFieldValidator2 ControlToValidate Textbox2
ValidationGroup Abc
ShowSummary or ShowMessageBox True
ValidationSummary1
ValidationGroup1 Abc
Text Send
Button1 Adnan Amin (Lecturer /
CausesValidation True 19
Programmer)
Arrange all the controls on web form in given layout

Output Design View using asp.net

First Name: [requiredFieldValidator1]

 
Last Name: [requiredFieldValidator2]
 
  Send ValidationSummary
 
 

Adnan Amin (Lecturer /

20
Programmer)
Codes:
 <form id="form1" runat="server">
<div>
First Name:<br />
<asp:TextBox ID="TextBox1" runat="server" ValidationGroup="mytext">
</asp:TextBox>
 
<asp:RequiredFieldValidator ID="RequiredFieldValidator1"
runat="server" ControlToValidate="TextBox1"
ErrorMessage="* First name is required."
ValidationGroup="abc">
</asp:RequiredFieldValidator><br />
 
Last Name:<br />
<asp:TextBox ID="TextBox2" runat="server" ValidationGroup="mytext">
</asp:TextBox>
 
<asp:RequiredFieldValidator ID="RequiredFieldValidator2"
runat="server" ControlToValidate="TextBox2"
ErrorMessage="* Last name is required."
ValidationGroup="abc">
</asp:RequiredFieldValidator><br />
 
<asp:Button ID="Button1" runat="server" Text="Send"
ValidationGroup="abc" /> <br />

<asp:ValidationSummary ID="ValidationSummary1" runat="server"

ValidationGroup="abc" />
</div> Adnan Amin (Lecturer /
21
</form> Programmer)
 Thank You!
0 References
0 Adnan’s lecture material
0 Professional ASP.net by Wrox team
0 www.geoamins.com

Adnan Amin (Lecturer /

22
Programmer)