Software

Engineering
Lab 10

Name: Neasa Ali

Roll no: 2018-CPE-31.

Submitted to: Sir UbaidUllah

0
 Lab Session 10

OBJECT
Exploring some controls and the concept of field validation in ASP.Net

THEORY

Add a New Web Form to the Project

A new web form can be added to the project. To do so open Solution Explorer right click on the
root of the project and click on Add New item… A number of different types of templates are
displayed for the selection of the developer. Select Web Form and give this new item an
appropriate name.

Two check boxes at the bottom of the page allow the separation of the code and the
selection of a master page. The restructured code -behind schema of Visual Studio 2008
supports separation of code but makes it optional. The language selected for the project is
displayed in the language box.

Once a new page is open, select Default.aspx  Set as Start page to enable the debugger
to run this page whenever the project is d ebugged.

Figure 10.1 : Setting Up as Start Page

Adding a Table

To insert a table on a webpage, click Table  Insert Table. An Insert Table window pops up
enabling a user to select from the available templates or creating a customized table with required
number of cells and cell formatting.

Add a Dropdown List

Drag the Drop down list from the standard toolbox. Change its ID to DeptDropDown. Click on
the arrow on upper right hand corner of the control to see the various options available. Select the
Edit Items to add a number of options from which the user can select. The ListItem Collection
Editor opens in a pop up window. Click Add to add a new entry in the drop down list and type in
the name of the entry in the Text property. Click Add to enter another option or OK to exit.

Adding Radio Buttons

To add radio buttons on a webpage, drag the number of radio buttons required (here consider two
radio buttons are being dragged) from the standard toolbox. Rename them as studentRadioButton
and facultyRadioButton. Also change their text property to Student and faculty respectively. In
the GroupName property, write User for both of the radio buttons which makes them to belong
to same group.

Field Validation

Validation controls are available in the toolbox. Some of these are discussed below:

Required Field Validator

Required field validator is used for required fields. Fields that cannot be left empty is validated
using the required field validator. A good example will be a TextBox which is used for taking the
username as the input. Since the user must enter the username in the TextBox in order to access
the website. The required field validator can be used with the TextBox control to validate the input.
If user does not enter any data in the TextBox than an error message is displayed and further
processing of the request will be stopped.

In order to set the required validator on the TextBox control just drag and drop the validator on the
webform and set its ControltoValidate property to the TextBox id that is to be validated.

Regular Expression Validator

Regular Expression Validator is used to check the user input against some built in regular
expressions. The control provides the RegularExpression collection property that can be used to
select the desired Regular Expression. Some of the built in expressions are Email, postal code,
telephone number and many more. If the user input does not match the regular expression expected
an error will occur and the request for the resources will not be authorized unless the user corrects
the input data.

Range Validator

The Range Validator control is used to check whether the input control contains value in the
specified range. You can check the range of values against different data types such as String,
Date, Integer and so on.

The two most important properties of the range validator control is the Maximum value and the
minimum value. The range can be used to restrict the user data. Suppose if the user is entering a
roll number so the range can be set from 1 to 500.

Compare Validator

The compare validator control is used to compare the input server control's value. The compare
validator can be used to compare against a value or another control. If both the ControlToCompare
and ValueToCompare properties are set for a CompareValidator control, the ControlToCompare
property takes precedence.

It can be used to compare whether the user has selected a value from the dropdown list or not. For
this purpose, select the dropdown list from ControlToValidate property and in
ValueToCompare write down the string e.g. Select a Department (which must be the first entity
in the dropdown list) and set the Operator property to NotEqual.

Another good use of the compare validator is to check whether the passwords entered by the user
in the two TextBoxes while registering for a website are same or not. This validator also performs
validation on the client side as well as the server side. So, no postback will be required when doing
the comparison and hence resources will be saved and performance will increase.

Figure 10.2 : Validation Controls

EXERCISE

1. Design a web page LOGIN.aspx and apply field validation on it.

Hint:
o Use Required Field Validator for all the fields.
o Use Compare Validator for the Re-enter password.
Attach printout.

→ Created a new Empty project in Visual Studio. In Add folders and core references,
checked ☑ Web Forms.
→ Right-click on WebApp1.net, from pop-up, selected Add > Web Form.
→ Added items from the Toolbox

→ Also, added Required Field Validators.

<asp:RequiredFieldValidator ID=”user” runat=”server” ControlToValidate=”

username” ErrorMessage=”username is necessary” Font-
Size=”Small” ForeColor=”Red”></asp:RequiredFieldValidator>

<asp:RequiredFieldValidator ID=”pass” runat=”server” ControlToValidate=”

UserPass” ErrorMessage=”Password is necessary” Font-
Size=”Small” ForeColor=”Red”></asp:RequiredFieldValidator>

<asp:RequiredFieldValidator ID=”confirm” runat=”server” ControlToValidat

e=”ConfirmPass” ErrorMessage=”Confirm Password is necessary” Font-
Size=”Small” ForeColor=”Red” CssClass=”d-block”>
</asp:RequiredFieldValidator>

→ and Compare Field Validator.

<asp:CompareValidator ID=”PasswordValidator” runat=”server” ControlToVal

idate=”ConfirmPass” ControlToCompare=”UserPass” ErrorMessage=”Password m
ust be the same” Font-Size=”Small” ForeColor=”Red” CssClass=”d-block” />
→ Adding field validators to LoginForm.aspx was giving error, so updated Web.config
to ignore error

<appSettings>
<add key="ValidationSettings:UnobtrusiveValidationMode" value="None"
/>
</appSettings>

→ Then styled the webpage using Bootstrap framework, for this added bootstrap CDN
link the head tag of LoginForm.aspx & the final look of from is
2. Explain which of the validators are server-side validators and which are client-
side?

Validations can be performed on the server side or on the client side (web browser).

The user input validation take place on the Server Side during a post back session is
called Server-Side Validation.

The user input validation take place on the Client Side (web browser) is called Client-
Side Validation.

Server-Side Validation
In the Server-Side Validation, the input submitted by the user is being sent to the server
and validated using one of server-side scripting languages such as ASP.Net, PHP etc.
After the validation process on the Server Side, the feedback is sent back to the client by
a new dynamically generated web page. It is better to validate user input on Server Side
because you can protect against the malicious users, who can easily bypass your Client-
Side scripting language and submit dangerous input to the server.

Client-Side Validation
In the Client-Side Validation, you can provide a better user experience by responding
quickly at the browser level. When you perform a Client-Side Validation, all the user
inputs validated in the user's browser itself. Client-Side validation does not require a
round trip to the server, so the network traffic which will help your server perform better.
This type of validation is done on the browser side using script languages such as
JavaScript, VBScript or HTML5 attributes.

Mostly the Client-Side Validation depends on the JavaScript Language, so if users turn
JavaScript off, it can easily bypass and submit dangerous input to the server. So the
Client Side Validation cannot protect your application from malicious attacks on your
server resources and databases.

As both the validation methods have their own significances, it is recommended that the
Server-side validation is more SECURE!