ASP.NET CHAPTER 2: ASP.

NET WEB FORMS SERVER CONTROLS

CHAPTER 2:ASP.NET WEB FORMS SERVER CONTROLS

CHAPTER 2: OBJECTIVES
 ASP.NET Web Forms Label
 ASP.NET Web Forms TextBox
 ASP.NET Web Forms Button
 ASP.NET Web Forms HyperLink
 ASP.NET Web Forms RadioButton
 ASP.NET Web Forms Calendar
 ASP.NET Web Forms CheckBox
 ASP.NET Validation Controls
ASP.NET provides web forms controls that are used to create HTML components. These
controls are categories as server and client based. The following table contains the server
controls for the web forms.

SET BY: ENG.YAHYE AHMED YAHYE Page 1

ASP.NET CHAPTER 2: ASP.NET WEB FORMS SERVER CONTROLS

ASP.NET Web Forms Label

This control is used to display printed information on the web forms. It is mainly used to create
caption for the other controls like: textbox.
To create label either we can write code or use the drag and drop capacity of visual studio .
This is server side control, asp provides own tag to create label. The example is given below.
< asp:LabelID="Label1" runat="server" Text="Label" ></asp:Label>
This control has its own properties that are tabled below.

ASP.NET Web Forms TextBox

This is an input control which is used to take user input.

To create TextBox either we can write code or use the drag and drop ability of visual studio IDE.
This is server side control, asp provides own tag to create it. The example is given below.
< asp:TextBoxID="TextBox1" runat="server" ></asp:TextBox

SET BY: ENG.YAHYE AHMED YAHYE Page 2

ASP.NET CHAPTER 2: ASP.NET WEB FORMS SERVER CONTROLS

This control has its own properties that are tabled below.

ASP.NET Web Forms Button

This control is used to perform events. It is also used to submit client request to the server. To
create Button either we can write code or use the drag and drop facility of visual studio IDE.
This is a server side control and asp provides own tag to create it. The example is given below.
< asp:ButtonID="Button1" runat="server" Text="Submit" BorderStyle="Solid" ToolTip="Submit"/>
This control has its own properties that are tabled below.

SET BY: ENG.YAHYE AHMED YAHYE Page 3

ASP.NET CHAPTER 2: ASP.NET WEB FORMS SERVER CONTROLS

ASP.NET Web Forms HyperLink

It is a control that is used to create a hyperlink. It responds to a click event. We can use it to refer
any web page on the server.
To create HyperLink either we can write code or use the drag and drop ability of visual studio
IDE. This control is listed in the toolbox.
This is a server side control and ASP.NET provides own tag to create it. The example is given
below.
< asp:HyperLinkID="HyperLink1" runat="server" Text="JavaTpoint" NavigateUrl=“default.aspx" ></asp:HyperLink>
This control has its own properties that are tabled below.

ASP.NET Web Forms RadioButton

It is an input control which is used to takes input from the user. It allows user to select a choice
from the group of choices.
To create RadioButton we can drag it from the toolbox of visual studio.
This is a server side control and ASP.NET provides own tag to create it. The example is given
below.
< asp:RadioButtonID="RadioButton1" runat="server" Text="Male" GroupName="gender"/>

SET BY: ENG.YAHYE AHMED YAHYE Page 4

ASP.NET CHAPTER 2: ASP.NET WEB FORMS SERVER CONTROLS

This control has its own properties that are tabled below.

ASP.NET Web Forms CheckBox

It is used to get multiple inputs from the user. It allows user to select choices from the set of
choices.
It takes user input in yes or no format. It is useful when we want multiple choices from the user.
To create CheckBox we can drag it from the toolbox in visual studio.
This is a server side control and ASP.NET provides own tag to create it. The example is given
below.
< asp:CheckBox ID="CheckBox2" runat="server" Text="J2EE"/>
This control has its own properties that are tabled below.

ASP.NET Web Forms Calendar

SET BY: ENG.YAHYE AHMED YAHYE Page 5
ASP.NET CHAPTER 2: ASP.NET WEB FORMS SERVER CONTROLS

It is used to display selectable date in a calendar. It also shows data associated with specific date.
This control displays a calendar through which users can move to any day in any year.
We can also set Selected Date property that shows specified date in the calendar.
To create Calendar we can drag it from the toolbox of visual studio.
This is a server side control and ASP.NET provides own tag to create it. The example is given
below.
< asp:CalendarID="Calendar1" runat="server"
SelectedDate="2017-06-15" ></asp:Calendar>
This control has its own properties that are tabled below.

SET BY: ENG.YAHYE AHMED YAHYE Page 6

ASP.NET CHAPTER 2: ASP.NET WEB FORMS SERVER CONTROLS

ASP.NET Validation server controls allow you to easily validate any data a user has entered in a
Web form.
Validation controls allow you to completely customize the way error messages are displayed to
users when data values don’t pass validation.
ASP.NET Validation Control Types

Validation controls will only validate input with a subset of ASP.NET server controls.
these controls will be more than basic to validate all user input.
The controls that can have their input validated by ASP.NET’s Validation controls are
 TextBox
 ListBox
 DropDownList
 RadioButtonList

<form id="form1" runat="server">

SET BY: ENG.YAHYE AHMED YAHYE Page 7

ASP.NET CHAPTER 2: ASP.NET WEB FORMS SERVER CONTROLS

Enter your Name:<asp:TextBox ID="TextBox1" runat="server"

Width="122px"></asp:TextBox>
<asp:Label ID="Label1" runat="server" ForeColor="#CC0000"
Text="*"></asp:Label>
&nbsp;&nbsp;
<asp:RequiredFieldValidator ID="RequiredFieldValidator1"
runat="server" ControlToValidate="TextBox1" ErrorMessage="Name
is reguired" ForeColor="#CC0000"></asp:RequiredFieldValidator>
<br />
<asp:Button ID="Button1" runat="server" Text="Button" />
<br />
</form>
The validation process follows on both the server and client sides.

Using Validation Controls

All Validation controls share similar properties. At a minimum, each control should specify two
properties (not including runat=”server”).First, they all must contain the ControlToValidate
property, which specifies the name of the server control that this validator must watch over.
Second, each control must have an ErrorMessage property that tells ASP.NET what message to
display to the user if the validation fails. There are a few additional properties.

CompareValidator Control

SET BY: ENG.YAHYE AHMED YAHYE Page 8

ASP.NET CHAPTER 2: ASP.NET WEB FORMS SERVER CONTROLS

The CompareValidator control compares a value in one control with a fixed value or a value in
another control.

It has the following specific properties:

<asp:CompareValidator runat=”server”

ControlToValidate=”tbFName”

ControlToCompare=”tbLName”

Type=”String”

Operator=”NotEqual”

ErrorMessage=”First and last name cannot be the same”

Display=”dynamic” />

Range Validator Control

SET BY: ENG.YAHYE AHMED YAHYE Page 9

ASP.NET CHAPTER 2: ASP.NET WEB FORMS SERVER CONTROLS

The Range Validator control validates that the input value falls within a determined range.

It has three specific properties:

<asp:RangeValidator ID="rvclass" runat="server"

ControlToValidate="txtage"
ErrorMessage="Enter your class (6 - 12)"
MaximumValue="12"
MinimumValue="6" Type="Integer">

</asp:RangeValidator>
RegularExpressionValidator

<asp:RegularExpressionValidator ID="remail"

SET BY: ENG.YAHYE AHMED YAHYE Page 10

ASP.NET CHAPTER 2: ASP.NET WEB FORMS SERVER CONTROLS

runat="server" ControlToValidate="txtemail"

ErrorMessage="Enter your email"

ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-
.]\w+)*"> </asp:RegularExpressionValidator>

Validation Summary

The Validation Summary control does not perform any validation but shows a summary of all
errors in the page.
The summary displays the values of the ErrorMessage property of all validation controls that
failed validation.
The following two mutually inclusive properties list out the error message:
Show Summary: shows the error messages in specified format.
ShowMessageBox: shows the error messages in a separate window.
The syntax for the control is as given:

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

DisplayMode = "BulletList" ShowSummary = "true"
HeaderText="Errors:" />

THE END

SET BY: ENG.YAHYE AHMED YAHYE Page 11