UNIT 2

1. DESIGN A MASTER PAGE WITH HEADER, SIDEBAR, FOOTER, AND CONTENT SECTION. IN
SIDEBAR DISPLAY MENU : HOME, CATEGORY(MEN, WOMEN), ABOUT US, CONTACT US,
REGISTER AND LOGIN. DISPLAY COMPANY NAME IN HEADER AND COPYRIGHT WARNING IN
FOOTER. CREATE MENU USING SITEMAP AND PROVIDE VARIOUS PAGES LINK.

1) Open visual studio > file > new > web site> add new item> master page
2) In master page get table and make header, footer, sidebar and content section.
3) In sidebar get tree-view or menu.
4) Click > arrow and edit nodes. Like name and URL.
5) Write copyright waring in footer and company name at header.
6) Make various pages according to nodes.
7) Add new item > sitemap(default name = web.sitemap)
8) In this file write code.
<?xml version="1.0" encoding="utf-8" ?>
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >
<siteMapNode url="home.aspx" title="Home">
<siteMapNode url="category.aspx" title="Category">
<siteMapNode url="men.aspx" title="Men"/>
<siteMapNode url="women.aspx" title="Women"/>
</siteMapNode>
<siteMapNode url="about.aspx" title="About Us"/>
<siteMapNode url="contact.aspx" title="Contact Us"/>
<siteMapNode url="login.aspx" title="Login"/>
<siteMapNode url="register.aspx" title="Register"/>
</siteMapNode>
</siteMap>
9) Add new item > web form(default.aspx) (select master page = true)
10) In default page click on > arrow and click default master’s content.

2 . DESIGN A WEBPAGE TO TAKE EMPLOYEE NO,

EMPLOYEE ID, EMPLOYEE NAME, USERNAME,
PASSWORD, CONFIRM PASSWORD, DATE OF BIRTH,
GENDER, CITY, EMAIL, MOBILE NUMBER, EXPERIENCE
YEARS. VALIDATE AS BELOW :

1) Open visual studio > file > new > web site> add new item> master page
2) Add all fields and textboxes / dropdown list.
3) ALL Add required field validator (add control to validate, error message, and id)
4) “EMP0001” add regular field validator and add (control to validate, error message, id and) validation expression EMP\d{4}$
5) NAME add regular field validator and add (control to validate, error message, id and) validation expression [A-Za-z]+$
6) PASSWORD add regular field validator and add (control to validate, error message, id and) validation expression .{8,}$
7) COMPARE PASSWORD add compare validator to confirm password, add control to compare pw and control to validate cpw.
8) BIRTH DATE 1985 to 2000 add range validator > minimum 1985, maximum 2001
9) EXPERIENCE YEAR change textmode to number and add range validator > minimum 2, maximum 10
10) EMAIL regular expression > validation expression \w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*
11) MOBILE NUMBER regular expression > validation expression \d{10}

7
12) CITY make dropdown list
13) VALIDATION SUMMARY add validation summary to page.

3 . EXTEND PROGRAM 2, IF ALL DATA IS VALID THEN STORE IT INTO A TABLE EMPLOYEE OF
DATABASE ORGANIZATION AND DISPLAY ALL RECORDS FROM AN EMPLOYEE TABLE WITH
PROPER FORMATTING USING A REPEATER CONTROL. ALSO ALLOW TO DELETE OR UPDATE
RECORD.(NOTE : EMP NO FIELD IS AUTOINCREMENT)

1) if you have already 2nd program then, get data from previous program, or you have not previous program then following these steps :
a. Open visual studio > file > new > web site> add new item > web form(Default.aspx)
b. Write some fields like ( Emp ID, Emp Name, Password, DOB, Experience Year, Email, Mobile and City)
c. And add textboxes for all, after this make one button for insert record

d.
e. Set Textmode for all textboxes
i. Emp ID = number
ii. Emp Name = singleline
iii. Password = password
iv. DOB = date
v. Experience Year = number
vi. Email = email
vii. Mobile = number
viii. City = singleline
f. This all steps are for making some data (if you don’t have 2nd program then use this)
2) Make database in Microsoft Access open access > blank database > database name(employee) >
3) Then make column names (you make in data form) like empid, empname, password, dob, expyear, email, mobile, city
4) Save this and name of table is employeetbl > close Microsoft access
5) In visual studio > solution explorer > add existing item > employee.accdb
6) Double click on insert button and write this code :
protected void Button1_Click(object sender, EventArgs e)
{
string connStr = @"Provider=Microsoft.ACE.OLEDB.12.0;Data Source=C:\p3\employee.accdb;";
using (OleDbConnection cn = new OleDbConnection(connStr))
{
cn.Open();
string qry = "INSERT INTO employeetbl VALUES (?, ?, ?, ?, ?, ?, ?, ?)";
using (OleDbCommand cmd = new OleDbCommand(qry, cn))
{
cmd.Parameters.AddWithValue("?", Convert.ToInt32(id.Text));
cmd.Parameters.AddWithValue("?", name.Text); // in this all I have change id name if
cmd.Parameters.AddWithValue("?", pw.Text); // you don’t change then write
cmd.Parameters.AddWithValue("?", Convert.ToDateTime(dob.Text)); //TextBox(number).Text
cmd.Parameters.AddWithValue("?", Convert.ToInt32(exp.Text));
cmd.Parameters.AddWithValue("?", email.Text);
cmd.Parameters.AddWithValue("?", mobile.Text);
cmd.Parameters.AddWithValue("?", city.Text);
cmd.ExecuteNonQuery();
}
Response.Write("Inserted successfully!");

}
}
7) This code is for save data in database
8) Now we have 2 options : if you only show your data use repeater control and if you are update from a website then use
gridview. We use both
9) First create gridview > drag gridview from toolbox and drop to the body
10) Click on > (arrow) and choose data source. Browse data source and click on next > select * > click advanced > check both
> click ok > click next > click finish

8
11) Gridview is over, now create repeater control
12) Toolbox > repeater > click (>) arrow > choose data source > in this you have use your previous database.
13) Go to source and write this code in html repeater tag :
<asp:Repeater ID="Repeater1" runat="server" DataSourceID="AccessDataSource1">
<HeaderTemplate>
<table border="1">
<ItemTemplate>
<tr>
<td>EmpID</td>
<td>Emp Name</td>
<td>Password</td>
<td>Date of Birth</td>
<td>Experience year</td>
<td>E-mail</td>
<td>Mobile no.</td>
<td>City</td>
</tr>
</ItemTemplate>
</HeaderTemplate>
<ItemTemplate>
<tr>
<td><%# Eval("empid") %></td>
<td><%# Eval("empname") %></td>
<td><%# Eval("password") %></td>
<td><%# Eval("dob") %></td>
<td><%# Eval("expyear") %></td>
<td><%# Eval("email") %></td>
<td><%# Eval("mobile") %></td>
<td><%# Eval("city") %></td>
</tr>
</ItemTemplate>
<SeparatorTemplate>
<tr>
<td colspan="8"></td>
</tr>
</SeparatorTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
</asp:Repeater>
14) Now run your program using ctrl + f5

4 . CREATE A DATABASE WITH TWO TABLES AS “CATEGORY”, WHICH CONTAIN CATEGORY ID

AND CATEGORY NAME AND “PRODUCTS” WHICH CONTAIN PRODUCTS DETAILS SUCH AS
PROD_ID, CAT_ID, PROD_NAME, PRICE, DESCPRIPTION, PRODIMGURL FOR EACH PRODUCT.
DISPLAY NAME OF ALL THE CATEGORIES IN A DROPDOWNLIST AND ACCORDING TO USER’S

9
 CHOICE, PARTICULAR CATEGORIES PRODUCT’S
DETAILS RECORD SHOULD DISPLAY IN A GRIVIEW
CONTROL. ALLOW TO UPDATE AND DELETE
RECORDS THROUGH THE GRIDVIEW

1) Open Microsoft access and make new database.

2) Make two tables. First is category and second is product. Also add some data in this fields.

3) Open visual studio and add web form(default.aspx).

4) Drag dropdown list and drop to body > connect data source, And display=cat_name value=Cat_id and enable auto postback
5) Drag gridview click (>) arrow > choose data source > access > choose data source > click next > In category ->cat_id and
in product -> select * > click where > write this all > click add > click ok > click next > finish

6) Click (>) arow and click edit columns in this :

7) In selected fields click on prodimgurl and after this click on convert this field into a templatefield > ok

8) Click (>) arrow > edit templates > drop image from toolbox > click image tag arrow (>) > edit databindings >

9) Click ok and end template. Run program

10
 5 . USING DATABASE PROGRAM 4, DESIGN A WEB PAGE WHICH SHOW HYPERLINK FOR
EACH UNIQUE CATEGORY. WHEN USER CLICK ON SPECIFIC HYPERLINK PASS THAT CATEGORY
TO ANOTHER PAGE. THIS PAGE LIST ALL PRODUCTS WHICH BELONG TO THE CATEGORY
SELECTED BY THE USER ON THE PREVIOUS PAGE. PAGE SHOWS SMALL IMAGE OF PRODUCT
AND PRICE ONLY. WHEN USER CLICKS ON A SMALL PRODUCT IMAGE THEN USER WILL BE
REDIRECT TO PRODUCTDETAILS.ASPX PAGE WHICH SHOWS ALL THE DETAILS OF THE PRODUCT
WITH LARGER IMAGE.

6. DEVELOP A WEB APPLICATION TO RESERVE ONLINE A HOTEL. THE USER SHOULD

ENTER/SELECT DATE OF ARRIVAL, NUMBER OF DAYS, ROOM TYPE, NUMBER OF PERSONS ETC.
HE WOULD BE ABLE TO CONFIRM BOOKING AND ALLOWED TO PAY ADVANCE ON
CONFIRMATION.(MAKE TABLE ROOMTYPE : ROOMTYPEID, ROOMTYPE, PRICE)

7. DISPLAY NAME OF STATE IN DROPDOWN LIST. ALLOW THE USER TO SELECT THE STATE AND
DISPLAY THE NAME OF CITIES USING DATA READER. CREATE TABLE STATE(STATE_ID,
STATE_NAME) AND CITY(CITY_ID,CITY_NAME,STATE_ID)

1) Open Microsoft access > blank database > (rename database name and file location) > create
2) Write this table and data :

3) Save this and open visual studio > new website > web form(Default1.aspx)

4) Add two dropdown list also enable postback

11
5) Click in arrow of first dropdown list and choose data source : in this dropdown select state table and all (*) and finish > after this display is
state_name and value is state_id and click ok.

6) Make another dropdown database for city like previous.

7) Double click on dropdown list 1 and write this code

Add two : using System.Data.OleDb; and System.Data;

DropDownList2.Items.Clear();
OleDbConnection cn = new OleDbConnection(@"Provider=Microsoft.ACE.OLEDB.12.0;Data Source=C:\One
Drive\OneDrive\Desktop\Sem 4\5. WAD practical\U2\p7\p7.accdb");
string qry = "SELECT city_name FROM city WHERE state_id = " + DropDownList1.SelectedValue;
OleDbCommand cmd = new OleDbCommand(qry, cn);
OleDbDataReader dr;
cn.Open();
dr = cmd.ExecuteReader();
while (dr.Read()) {
DropDownList2.Items.Add(dr[0].ToString());
}
cn.Close();
8) Run the program

8. DESIGN A WEB SITE WHICH ALLOW USER TO LOGIN. AS USER LOGINS, THE HOME PAGE

DISPLAY WELCOME MASSAGE BASED ON THE TYPE OF USER. FOR EX FOR ANONYMOUS USER
SHOW “WELCOME VISITOR”, FOR USER SHOW “WELCOME<USERNAME>” AND FOR ANY
USER BELONGS TO ADMIN ROLE, SHOW “WELCOME ADMINISTRATOR”.

1) Create this webforms:

a. login.aspx
b. newuser.aspx
c. fogot.aspx
d. changepassword.aspx
e. default.aspx
2) drag tags from toolbox and drop it into files
a. login drop to login.aspx

write properties :

b. click this configuration button :

c. Click security > click create or manage roles > add role
d. Back to home > in first dialog box enable authentication and > click create user > write name, password and many more
> continue.
e. create user wizard drop to newuser.aspx

write properties :
f. password recovery drops to forgot.aspx
write code to fogot.aspx.cs :
protected void PasswordRecovery1_VerifyingUser(object sender, LoginCancelEventArgs e)
{
Response.Redirect("changepassword.aspx");
}
g. change password drop to changepassword.aspx
write this code to changepassword.aspx.cs :
protected void ChangePassword1_ChangedPassword(object sender, EventArgs e)
12
 {
Response.Redirect("forgot.aspx");
}
h. login name drops to default.aspx
this code is for html :
<body>
<form id="form1" runat="server">
<div>
Welcome <asp:LoginName ID="LoginName1" runat="server" />
</div>
</form>
</body>

9. CREATE FOR TABLES AS GIVEN:

CUSTOMER(CUSTOMERCODE,NAME,ADDRESS)
PRODUCT(PRODUCTCODE,PRODUCTNAME,PRICE,QTY)
SALESMASTER(INVOICENUMBER,CUSTOMERCODE,DATEOFINVOICE)
SALESDETAILS(INVOICENUMBER,PRODUCTCODE,QTY,UNITPRIE)
DESIGN A WEB PAGE TO GENERATE INVOICE DETAILS IN WHICH CUSTOMER NAME,
PRODUCT NAME AND LINE TOTAL (UNIT PRICE * QUANTITY)IS SHOWN USING GRIDVIEW.

10. CREATE A FORM TO SHOW THE USE OF DIFFERENT LOGIN CONTROLS

13