WT Lab

RAJEEV GANDHI MEMORIAL COLLEGE OF ENGG.& TECH.
,
NANDYAL-518 501
(AUTONOMOUS)
DEPARTMENT OF
COMPUTER SCIENCE AND ENGINEERING
LAB MANUAL
WEB TECHNOLOGIES
III B.TECH-II SEM

RAJEEV GANDHI MEMORIAL COLLEGE OF ENGINEERING & TECHNOLOGY
(AUTONOMOUS)
DEPARTMENT OF COMPUTER SCIENCE & ENGINEERING
VISION OF THE DEPARTMENT
 To empower students with cutting edge technologies in computer science

and engineering
 To train the students as entrepreneurs in computer science and

engineering to address the needs of the society
 To develop smart applications to disseminate information to rural people
MISSION OF THE DEPARTMENT
 To become the best computer science and engineering department in the

region offering undergraduate, post graduate and research programs in
collaboration with industry
 To incubate, apply and spread innovative ideas by collaborating with

relevant industries and R & D labs through focused research groups.
 To provide exposure to the students in the latest tools and technologies to

develop smart applications for the society
RGM-R-2015
RAJEEV GANDHI MEMORIAL COLLEGE OF ENGG.& TECH., NANDYAL-518 501
AUTONOMOUS
III B. Tech. II- Sem (CSE) P C
3 2
(A0584156) WEB TECHNOLOGIES LAB
OBJECTIVE :
 To create a fully functional website with mvc architecture. To develop an online Book store using we
can sell books (Ex amazon .com).
OUTCOMES:
 To gain knowledge on designing static and dynamic web pages.
 Able to validate web pages at client-side.
 Design and validate XML documents.
 Gain knowledge on server side scripting.
 To develop a business application using STRUTS.
Hardware and Software required:
 A working computer system with either Windows or Linux
 A web browser either IE or firefox
 Tomcat web server and Apache web server
 XML editor like Altova Xml-spy [www.Altova.com/XMLSpy – free ] , Stylusstudio , etc.,
 A database either Mysql or Oracle
 JVM(Java virtual machine) must be installed on your system
 BDK(Bean development kit) must be also be installed
CO-PO MAPPING:
CO/PO PO1 PO2 PO3 PO4 PO5 PO6 PO7 PO8 PO9 PO10 PO11 PO12 PSO 1 PSO 2 PSO 3
CO1 1 2 2 1 2 2 2
CO2 1 1 2 2 1 1 2 1 1 2 2
CO3 1 1 2 2 1 2 2 1 2 2 2 2
CO4 1 3 2 2 2 2 2 2 3 1
CO5 1 1 2 2 2 2 2 1 3 2
CO6 1 1 2 2 2 3 1
Week-1:
Design the following static web pages required for an online book store web site.
1) HOME PAGE:
The static home page must contain three frames.
Top frame: Logo and the college name and links to Home page, Login page, Registration page,
Catalogue page and Cart page (the description of these pages will be given below).
Left frame: At least four links for navigation, which will display the catalogue of respective links.
For e.g.: When you click the link “CSE” the catalogue for CSE Books should be displayed in the Right frame.
Right frame: The pages to the links in the left frame must be loaded here. Initially this page contains
description of the web site.
Logo Web Site Name

Home Login Registration Catalogue Cart
CSE
ECE
Description of the Web Site
EEE
CIVIL
Fig 1.1
2) LOGIN PAGE:
This page looks like below:
Logo Web Site Name

Detailed Syllabus 113

RGM-R-2015
AUTONOMOUS
CSE
ECE Login :
EEE Password:
CIVIL
Submit Reset
3) CATOLOGUE PAGE:
The catalogue page should contain the details of all the books available in the web site in a table.
The details should contain the following:
1. Snap shot of Cover Page.
2. Author Name.
3. Publisher.
4. Price.
5. Add to cart button.
Logo Web Site Name
Book : XML Bible
CSE Author : Winston
Publication : Wiely $ 40.5
ECE
Book : AI
EEE
Author : S.Russel $ 63
Publication : Princeton hall
CIVIL
Book : Java 2
Author : Watson $ 35.5
Publication : BPB publications
Book : HTML in 24 hours

Author : Sam Peter $ 50
Publication : Sam publication
Week-2:
4) CART PAGE:
The cart page contains the details about the books which are added to the cart.
The cart page should look like this:
Logo Web Site Name
CSE Book name Price Quantity Amount
ECE Java 2 $35.5 2 $70
EEE XML bible $40.5 1 $40.5
CIVIL Total amount - $130.5

RGM-R-2015
AUTONOMOUS
5) REGISTRATION PAGE:
Create a “registration form “with the following fields
1) Name (Text field) 2) Password (password field)
3) E-mail id (text field)
4) Phone number (text field)
5) Sex (radio button)
6) Date of birth (3 select boxes)
7) Languages known (check boxes – English, Telugu, Hindi, Tamil)
8) Address (text area)
WEEK 3:
VALIDATION:
6) Write JavaScript to validate the following fields of the above registration page.
1. Name (Name should contains alphabets and the length should not be less than 6 characters).
2. Password (Password should not be less than 6 characters length).
3. E-mail id (should not contain any invalid and must follow the standard pattern (name@domain.com)
4. Phone number (Phone number should contain 10 digits only).
Week-4:
7) Design a web page using CSS (Cascading Style Sheets) which includes the following:
1) Use different font, styles:
In the style definition you define how each selector should work (font, color etc.). Then, in the body of your
pages, you refer to these selectors to activate the styles.
For example:
<HTML>
<HEAD>
<style type="text/css">
B.headline {color:red; font-size:22px; font-family:arial; text-
decoration:underline}
</style>
</HEAD>
<BODY>
<b>This is normal bold</b><br>
Selector {cursor:value}
For example:
<html>
<head>
.xlink {cursor:crosshair}
.hlink{cursor:help}
</style>
</head>
<body>
<b>
<a href="mypage.htm" class="xlink">CROSS LINK</a>
<br>
<a href="mypage.htm" class="hlink">HELP LINK</a>

RGM-R-2015
AUTONOMOUS
</b>
</body>
</html>
<b class="headline">This is headline style bold</b>

</BODY>
</HTML>
2) Set a background image for both the page and single elements on the page.
You can define the background image for the page like this:
BODY {background-image:url(myimage.gif);}
3) Control the repetition of the image with the background-repeat property.

As background-repeat: repeat Tiles the image until the entire page is filled, just like an ordinary background
image in plain HTML.
4) Define styles for links as
A:link
A:visited
A:active
A:hover
Example:
A:link {text-decoration: none}
A:visited {text-decoration: none}
A:active {text-decoration: none}
A:hover {text-decoration: underline; color: red;}
</style>
Week-5:
8) Write an XML file which will display the Book information which includes the following:
1) Title of the book
2) Author Name
3) ISBN number
4) Publisher name
5) Edition
6) Price
9) Write a Document Type Definition (DTD) to validate the above XML file.
10) Display the XML file as follows.
The contents should be displayed in a table. The header of the table should be in color GREY. And the Author
names column should be displayed in one color and should be capitalized and in bold. Use your own colors for
remaining columns.
Use XML schemas XSL and CSS for the above purpose.
Week-6:
11) Install TOMCAT web server and APACHE.
While installation assign port number 4040 to TOMCAT and 8080 to APACHE. Make sure that
these ports are available i.e., no other process is using this port.
12) Access the above developed static web pages for books web site, using these servers by putting the web
pages developed in week-1 and week-2 in the document root.

RGM-R-2015
AUTONOMOUS
Access the pages by using the urls : http://localhost:4040/rama/books.html (for tomcat)
http://localhost:8080/books.html (for Apache)
Week-7:
13) User Authentication: Write a Servlet which does the following job: Insert the details of the 3 or 4 users
who register with the web site (week9) by using registration form. Authenticate the user when he submits the
login form using the user name and password from the database
Week-8:
14) Install a database(Mysql or Oracle).
Create a table which should contain at least the following fields: name, password, email-id, phone number(these
should hold the data from the registration form).
Practice 'JDBC' connectivity.
15) Write a java program/servlet/JSP to connect to that database and extract data from the tables and display
them. Experiment with various SQL queries.
Insert the details of the users who register with the web site, whenever a new user clicks the submit button in the
registration page (week2).
Week-9:
16) Write a JSP which does the following job: Insert the details of the 3 or 4 users who register with the web
site (week9) by using registration form. Authenticate the user when he submits the login form using the user
name and password from the database
Week-10:
17) Assume four users user1,user2, user3 and user4 having the passwords, pwd2,pwd3 and pwd4 respectively.
Write a servlet for doing the following.
Create a Cookie and add these four user id’s and passwords to this Cookie
Week-11:
18) Create and Run struts application and validate it using struts components.
REFERENCES:
1. HTML Black Book – Steve Holzner.
2. The complete Reference Java 2 Fifth Edition by Patrick Naughton and Herbert Schildt. TMH
3. Java Server Pages –Hans Bergsten, SPD O’Reilly

WEB TECHNOLOGIES LAB MANUAL
Lab Exercises
1. Write a HTML program for the demonstration of Lists.
a. Unordered List
b. Ordered List
c. Definition List
d. Nested List
2. Write a HTML program for demonstrating Hyperlinks.
a. Navigation from one page to another.
b. Navigation within the page.
3. Write a HTML program for time-table using tables.
4. Write a HTML program to develop a static Home Page using frames.
5. Write a HTML program to develop a static Registration Form.
6. Write a HTML program to develop a static Login Page.
7. Write a HTML program to develop a static Web Page for Catalog.
8. Write a HTML program to develop a static Web Page for Shopping Cart.
9. Write HTML for demonstration of cascading stylesheets.
a. Embedded stylesheets.
b. External stylesheets.
c. Inline styles.
10. Write a javascript program to validate USER LOGIN page.
11. Write a javascript program for validating REGISTRATION FORM
12. Write a program for implementing XML document for CUSTOMER DETAILS.
13. Write an internal Document Type Definition to validate XML for CUSTOMER
DETAILS?
14. Write an external Document Type Definition to validate XML for CUSTOMER
DETAILS?
15. Write an XML for person information and access the data using XSL.
16. Write an XML for student information and access second students data using DOM.
17. Write a program to display contents of XML file in a table using Extensible Style
Sheets.
DEPT OF CSE, RGMCET 2

18. Write a simple servlet that displays a message.

19. Write a servlet that reads parameters from employee login page.
20. Write a servlet for creating a cookie and retrieving it.
21. Write a servlet for session tracking.
22. Write a JSP that reads parameters from user login page.
23. Write a JSP that reads a value, creates a cookie and retrieves it.
24. Write a JSP for session tracking.
25. Write a servlet that connects to the database and retrieves the data and displays it.

1. Write a HTML program for the demonstration of Lists.

e. Unordered List
f. Ordered List
g. Definition List
h. Nested List
Unordered List:
<html>
<head>
<title> Creating Unorder List </title>
</head>
<body bgcolor=”pink”>
<h1 align=”center”> Creating Unorder List</h1>
<h1 align=”center”>List of Colleges in Kurnool</h1>
<ul type=”square”>
<li>GPREC</li>
<li>RGMCET</li>
<li>GPCET</li>
</ul>
</body>
</html>
Output:

Ordered List:
<html>
<head>
<title> Creating Order List </title>
</head>
<h1 align=”center”> Creating Order List</h1>
<h1 align=”center”>List of branches in RGMCET</h1>
<ol type=”A”>
<li>CSE</li>
<li>IT</li>
<li>ECE</li>
<li>EEE</li>
<li>CIVIL</li>
<li>ME</li>
</ol>
</body>
</html>
Output:

Definition List:
<html>
<head>
<title>Creating Definition List</title>
</head>
<h1 align=”center”>Definition List</h1>
<dl>
<dt>CSE<dd>Computer Science & Engineering
<dt>ECE<dd>Electronics & Communication Engineering
<dt>IT<dd>Information Technology
<dt>EEE<dd>Electrical & Electronics Engineering
<dt>CE<dd>Civil Engineering
</dl>
</body>
</html>
Output:

Nested List:
<html>
<head>
<title>Nested Lists</title>
</head>
<h1 align=”center”>List of Colleges in Kurnool</h1>
<ol>
<li>Kurnool</li>
<ul>
<li>GPREC</li>
<li>BITS</li>
<li>GPCET</li>
</ul>
<li>Nandyala</li>
<ul>

<li>RGMCET</li>
<li>SREC</li>
</ul>
</ol>
</body>
</html>
Output:
2. Write a HTML program for demonstrating Hyperlinks.

c. Navigation from one page to another.
d. Navigation within the page.
Navigation from one page to another:
<html>
<head>
<title>Setting Hyperlink colors</title>
</head>
<body bgcolor="pink" link=”green” vlink=”blue” alink=”red”>
<center><h1>Setting Hyperlink colors</h1>
<a href=”login.html”>Click here</a>to goto login page
</body>
</html>
Output:

Navigation within the page:

<html>
<head>
<title>Nested Lists</title>
</head>
<body bgcolor="pink">
<center><h1>Linking to a section in a page</h1>
<a name=”top”>This is the top of the page</a>
Click here to goto the <a target=”#bottom”>bottom</a>of the page
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br>
<a name=”bottom”>This is the bottom of the page</a> Click
here to goto <a target=”#top”>top</a>of the page
</center>
</body>
</html>
Output:


3. Write a HTML program for time-table using tables.

<html>
<head>
<title>Timetable</title>
</head>
<body>
<h1 align="center"><font color="Salmon">Timetable of III
CSE</font></h1><br>
<table align="center" border="2" cellspacing="0" cellpadding="15">
<tr align="center" valign=="middle">
<th>DAY</th>
<th>I</th>
<th>II</th>
<th
rowspan="7"><b>T<br>E<br>A<br><br>B<br>R<br>E<br>A<br>K</b></th>
<th>III</th>
<th>IV</th>
<th
rowspan="7"><b>L<br>U<br>N<br>C<br>H<br><br>B<br>R<br>E<br>A<br>K</
b></th>
<th>V</th>
<th>VI</th>
<th>VII</th>
</tr>
<tr align="center">
<th>MON</th>
<td>IS</td>
<td>WT</td>
<td>SEM</td>
<td>OOAD</td>

<td>SCI</td>
<td>C#</td>
<td>COMP</td>
</tr>
<tr align="center">
<th>TUE</th>
<td>AP</td>
<td>AP Lab</td>
<td colspan="2">AP Lab</td>
<td>WT</td>
<td>IS</td>
<td>OOAD</td>
</tr>
<tr align="center">
<th>WED</th>
<td>WT</td>
<td>IS</td>
<td>C#</td>
<td>SCI</td>
<td colspan="3">MOOC'S</td>
</tr>
<tr align="center">
<th>THU</th>
<td>IS</td>
<td>LIB</td>
<td>OOAD</td>
<td>WT</td>
<td colspan="3">WT Lab</td>
</tr>
<tr align="center">

<th>FRI</th>
<td>AP</td>
<td>AP</td>
<td>C#</td>
<td>OOAD</td>
<td colspan="3">C# Lab</td>
</tr>
<tr align="center">
<th>SAT</th>
<td>OOAD</td>
<td>SCI</td>
<td>WT</td>
<td>SEM</td>
<td>AP</td>
<td>AP</td>
<td>C#</td>
</tr>
</table>
</body>
</html>
Output:


4. Write a HTML program to develop a static Home Page using frames.

<html>
<head>
<title>RGM ENGINEERING COLLEGE</title>
</head>
<frameset cols="30%,70%">
<frameset rows="25%,25%,50%">
<frame src="e:\cse546\logo.html">
<frame src="e:\cse546\home1.html">
<frame src="e:\cse546\courses.html">
</frameset>
<frameset rows="25%,25%,50%">
<frame src="e:\cse546\name.html">
<frame src="e:\cse546\table.html">
<frame src="e:\cse546\default.html" name="display">
</frameset>
</frameset>
</html>
Output:

5. Write a HTML program to develop a static Registration Form.

<html>
<head>
<title>Registration</title>
</head>
<body bgcolor=lightblue>
<h1 align=center><u>Registration Form</u></h1>
<br><br><br>
<div>
<strong>
First Name &nbsp <input type=text value=" " name="txt1"><br><br>
Last Name &nbsp <input type=text value=" " name="txt2"><br><br>
UserName &nbsp <input type=text value="" name="txt3"><br><br>
Password &nbsp <input type=password value="" name="pwd1"><br>
Confirm Password &nbsp <input type=password value="" name="pwd2"><br><br>
Address &nbsp <textarea rows=3 cols=60></textarea><br><br>
Date of Birth &nbsp
dd<select name="sel1">
<option>--</option>
<option>01</option>
<option>02</option>
<option>03</option>
<option>04</option>
<option>05</option>
<option>27</option>
<option>28</option>
<option>29</option>
<option>30</option>
<option>31</option>
</select>

mm<select name="sel2">
<option>--</option>
<option>01</option>
<option>02</option>
<option>03</option>
<option>04</option>
<option>05</option>
<option>06</option>
<option>07</option>
<option>08</option>
<option>09</option>
<option>10</option>
<option>11</option>
<option>12</option>
</select>
yyyy<select name="sel3">
<option>----</option>
<option>1987</option>

</select><br><br>
Sex &nbsp
<input name="rb1" type="radio" value="radiobutton">Male
<input name="rb1" type="radio" value="radiobutton">Female
<br><br>
Martial Status &nbsp
<input name="rb2" type="radio" value="radiobutton">Single
<input name="rb2" type="radio" value="radiobutton">Married
<br><br>
Mobile Number &nbsp <input type=text name="txt4"><br><br>
Branch &nbsp
<input name="rb3" type="radio" value="radiobutton">CSE

<input name="rb3" type="radio" value="radiobutton">IT

<input name="rb3" type="radio" value="radiobutton">ECE
<input name="rb3" type="radio" value="radiobutton">EEE
<input name="rb3" type="radio" value="radiobutton">MECH
<br><br>
Languages Known &nbsp
<input name="cb1" type="checkbox" value="checkbox">English
<input name="cb1" type="checkbox" value="checkbox">Telugu
<input name="cb1" type="checkbox" value="checkbox">Hindi
<input name="cb1" type="checkbox" value="checkbox">Kannada
<input name="cb1" type="checkbox" value="checkbox">Tamil
<br><br>
<center>
<input type=submit value="SUBMIT" name="btn1">&nbsp
<input type=reset value="CANCEL" name="btn1">
</center>
</strong>
</body>
</html>
Output:


6. Write a HTML program to develop a static Login Page.

<html>
<head>
<title>login</title>
</head>
<body>
<br><br><br><br>
<h1 align=center><u>LOGIN</u></h1>
<br><br><br>
<h4>
<center>
username&nbsp&nbsp<input type=text><br>
password&nbsp&nbsp<input type=password><br><br><br>
</h4>
<input type=submit value=submit>
&nbsp&nbsp
<input type=reset value=cancel>
</center>
</body>
</html>

Output:

7. Write a HTML program to develop a static Web Page for Catalog.

<html>
<head>
<title>catalouge</title>
</head>
<body>
<center>
<table border=2 cellpadding=10 cellspacing=10>
<tr>
<td> <img src="D:\cse546\image.jpg"height=100 width=100></td>
<td>Book:XML Bible<br>
Author:Wingston<br>
Publication:wiely</td>
<td>$40.5</td>
<td><input type="button"value="add to cart"></td>
</tr>
<tr>
<td> <img src="D:\cse546\image1.jpg"height=100 width=100></td>
<td>Book:A1<br>
Author:S.Rusell<br>
Publication:Princeton hall</td>
<td>$63</td>
</tr>
<tr>
<td>Book:JAVA 2<br>
Author:Watson<br>
Publication:BPB</td>
<td>$35.5</td>


</tr>
<tr>
<td>Book:Html in 24 hrs<br>
Author:Sam Peter<br>
Publication:SAM</td>
<td>$50</td>
</tr>
</table>
</center>
</body>
</html>
Output:

8. Write a HTML program to develop a static Web Page for Shopping Cart.
<html>
<head>
<title>Cart</title>
</head>
<body>
<center>
<table border=0 width=50 height=10 cellpadding=10 cellspacing=10>
<tr>
<th>Book name</th>
<th>Price</th>
<th>Quantity</th>
<th>Amount</th>
</tr>
<tr>
<td>JAVA 2</td>
<td>$35.5</td>
<td>2</td>
<td>$70</td>
</tr>
<tr>
<td>XML Bible</td>
<td>$40.5</td>
<td>1</td>
<td>$40.5</td>
</tr>
</table>
<h3>total amount-130.5</h3>
</center>
</body>

</html>
Output:

9. Write HTML for demonstration of cascading stylesheets.

d. Embedded stylesheets.
e. External stylesheets.
f. Inline styles.
Embedded stylesheets:
<html>
<head>
<title>Embedded Style sheets</title>
<style type=”text/css”>
body{backgroun
d-color: pink;}
h1
{color:orange;
text-align:
center;
}
p{
font-family: "Times
New Roman";
font-size: 20px;
}
</style>
</head>
<body>
<h1>Embedded Style Sheets</h1><br>
<p>This is a paragraph
</body>
</html>
Output:

External Stylesheets:
extern.css:
body {background-color: #d0e4fe;}
h1 {
color: orange; text-align: center;
}
p{
font-family: "Times New Roman"; font-size: 20px;
}
extern.html:
<html>
<head>
<title>External Style Sheets</title>
<link rel=”stylesheet” type=”text/css” href=”extern.css”>
</head>
<body>
<h1>External Style Sheets</h1><br>
<p>This is a paragraph
</body>
</html>

Output:
Inline styles:
<html>
<head>
<title>HTML Tables</table>
</head>
<body bgcolor=‟pink‟>
<center>
<h1>Creating HTML Tables</h1><br>
<table border=”2” cellpadding=”4” cellspacing=”4”>
<tr>
<th colspan=”2” style=”background-color:red”>
WebSites</th>
</tr>
<tr>
<th style=”background-
color:blue”>MailSites</th>
<th style=”background-
color:green”>JobSites</th>

</tr>
<tr>
<td style=”background-color:grey”>Gmail</td>
<td style=”background-color:aqua”>Naukri</td>
</tr>
<tr>
<td style=”background-
color:yellow”>Yahoo</td>
<td style=”background-
color:purple”>JobStreet</td>
</tr>
</table>
</center>
</body>
</html>
Output:

10. Write a javascript program to validate USER LOGIN page.

<html>
<head>
<title>Login Validation</title>
<script language="javascript">
function formValidator()
{
var username=document.getElementById('uname');
var password=document.getElementById('pwd');
if(isEmpty(username)&&isEmpty(password))
{
alert("enter something");
document.form1.uname.focus();
}
if(!isEmpty(username)&&isEmpty(password)&&isAlphabet(username))
{
alert("Please enter password");
document.form1.pwd.focus();
}
if(!isEmpty(username)&&!isEmpty(password)&&isAlphabet(username))
{
return true;
}
else
{
if(!isEmpty(username)&&!isEmpty(password)&&!isAlphabet(username))
{
alert("Please Enter only alphabets for username");
document.form1.uname.focus();
}

}
return false;
}
function isEmpty(elem)
{
if(elem.value.length==0)
{
return true;
}
return false;
}
function isAlphabet(elem)
{
var alphaExp=/^[a-z A-Z]+$/;
if(elem.value.match(alphaExp))
{
return true;
}
}
</script>
</head>
<body bgColor=megastar>
<h1 align=center>USER LOGIN VALIDATION</h1>
<br><br>
<form name="form1" onSubmit="return formValidator()">
<center>
<table border=0 colsSpacing=4>
<tr>
<td>Username:</td>
<td><input type=text value="" name="uname"></td>

</tr>
<tr>
<td>Password:</td>
<td><input type=password value="" name="pwd"></td>
</tr>
<tr>
<td><input type=submit value="SUBMIT" name="btn1"></td>
<td><input type=reset value="CANCEL" name="btn2"></td>
</tr>
</table>
</center>
</form>
</body>
</html>
Output:

11. Write a javascript program for validating REGISTRATION FORM.

<html>
<head>
<title>JavaScript sample registration from validation </title>
<script type='text/javascript'>
function formValidation()
{
var uid = document.form1.userid;
var passid = document.form1.passid;
var uname = document.form1.username;
var uadd = document.form1.address;
var uzip = document.form1.zip;
var uemail = document.form1.email;
var umsex = document.form1.msex;
var ufsex = document.form1.fsex;
if(userid_validation(uid,5,12))
{
if(userid_validation(passid,7,12))
{
if(allLetter(uname))
{
if(alphanumeric(uadd))
{
if(allnumeric(uzip))
{
if(ValidateEmail(uemail))
{
if(validsex(umsex,ufsex))
{
}

}
}
}
}
}
}
return false;
} function userid_validation(uid,mx,my)
{
var uid_len = uid.value.length;
if (uid_len == 0 || uid_len >= my || uid_len < mx)
{
alert("It should not be empty / length be between "+mx+" to "+my);
uid.focus();
return false;
}
return true;
}
function allLetter(uname)
{
var letters = /^[A-Za-z]+$/;
if(uname.value.match(letters))
{
return true;
}
else
{
alert('Please input alphabet characters only');
uname.focus();
return false;

}
}
function alphanumeric(uadd)
{
var letters = /^[0-9a-zA-Z]+$/;
if(uadd.value.match(letters))
{
return true;
}
else
{
alert('Please input alphanumeric characters only');
uadd.focus();
return false;
}
}
function allnumeric(uzip)
{
var numbers = /^[0-9]+$/;
if(uzip.value.match(numbers))
{
return true;
}
else
{
alert('Please input numeric characters only');
uzip.focus();
return true;
}
}

function ValidateEmail(uemail)
{
var mailformat = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;
if(uemail.value.match(mailformat))
{
return true;
}
else
{
alert("You have entered an invalid email address!");
uemail.focus();
return false;
}
} function validsex(umsex,ufsex)
{
x=0;
if(umsex.checked)
{
x++;
} if(ufsex.checked)
{
x++;
}
if(x==0)
{
alert('Select Male/Female');
umsex.focus();
return false;
}

else
{
return true;
}
}
</script>
</head>
<body>
<form name='form1' onsubmit='return formValidation()' >
<table width="500" cellpadding="3" style="border-collapse: collapse;">
<tr>
<td>User id </td>
<td><input type="text" name="userid" size="12" /></td>
</tr>
<tr>
<td>Password</td>
<td><input type="password" name="passid" size="12" /></td>
</tr>
<tr>
<td>Name</td>
<td><input type="text" name="username" size="50" /></td>
</tr>
<tr>
<td>Address</td>
<td><input type="text" name="address" size="50" /></td>
</tr>
<tr>
<td>ZIP Code </td>
<td><input type="text" name="zip" /></td>

</tr>
<tr>
<td>Email</td>
<td><input type="text" name="email" size="50" /></td>
</tr>
<tr>
<td>Sex</td>
<td><input type="radio" name="msex" value="Male" /> Male
<input type="radio" name="fsex" value="Female" /> Female</td>
</tr>
<tr>
<td>Language preference</td>
<td><input type="checkbox" name="en" value="en" checked />English
<input type="checkbox" name="nonen" value="noen" />Non English</td>
</tr>
<tr>
<td>Write about yourself<br>
(optional)</td>
<td><textarea name="desc" rows="4" cols="40"></textarea></td>
</tr>
<tr>
<td> </td>
<td><input type="submit" name="submit" value="Submit" /></td>
<td> </td>
</tr>
</table>
</form>
</body>
</html>

Output:

12. Write a program for implementing XML document for CUSTOMER DETAILS.
<?xml version="1.0"?>
<DOCUMENT>
<CUSTOMER>
<NAME>
<FIRST_NAME>Hari</FIRST_NAME>
<LAST_NAME>Krishna</LAST_NAME>
</NAME>
<DATE>10/09/2008</DATE>
<ORDERS>
<ITEM>
<PRODUCT>Mobile Set</PRODUCT>
<NUMBER>1</NUMBER>
<PRICE>Rs.14000/-</PRICE>
</ITEM>
<ITEM>
<PRODUCT>Mp3 Player</PRODUCT>
<NUMBER>1</NUMBER>
</ITEM>
</ORDERS>
</CUSTOMER>
<CUSTOMER>
<NAME>
<FIRST_NAME>Anil</FIRST_NAME>
<LAST_NAME>Kumar</LAST_NAME>
</NAME>
<DATE>10/09/2008</DATE>
<ORDERS>
<ITEM>

<PRODUCT>Monitor</PRODUCT>
<NUMBER>1</NUMBER>
</ITEM>
<ITEM>
<PRODUCT>Washing Machine</PRODUCT>
<NUMBER>1</NUMBER>
</ITEM>
</ORDERS>
</CUSTOMER>
</DOCUMENT>
Output:

13. Write an internal Document Type Definition to validate XML for CUSTOMER
DETAILS?
<!DOCTYPE DOCUMENT[
<!ELEMENT DOCUMENT (CUSTOMER)*>
<!ELEMENT CUSTOMER (NAME,DATE,ORDERS)>
<!ELEMENT NAME (FIRST_NAME,LAST_NAME)>
<!ELEMENT FIRST_NAME (#PCDATA)>
<!ELEMENT LAST_NAME (#PCDATA)>
<!ELEMENT DATE (#PCDATA)>
<!ELEMENT ORDERS (ITEM)*>
<!ELEMENT ITEM (PRODUCT,NUMBER,PRICE)>
<!ELEMENT PRODUCT (#PCDATA)>
<!ELEMENT NUMBER (#PCDATA)>
<!ELEMENT PRICE (#PCDATA)>
]>
<DOCUMENT>
<CUSTOMER>
<NAME>
<FIRST_NAME>aaa</FIRST_NAME>
<LAST_NAME>ZZZ</LAST_NAME>
</NAME>
<DATE>10/09/2008</DATE>
<ORDERS>
<ITEM>
<PRODUCT>Monitor</PRODUCT>
<NUMBER>1</NUMBER>
</ITEM>
</ORDERS>

</CUSTOMER>
</DOCUMENT>
Output:

14. Write an external Document Type Definition to validate XML for CUSTOMER
DETAILS?
Extern.dtd:
<!ELEMENT document (customer)*>
<!ELEMENT customer (name,date,orders)>
<!ELEMENT name (firstname,lastname)>
<!ELEMENT firstname (#PCDATA)>
<!ELEMENT lastname (#PCDATA)>
<!ELEMENT date (#PCDATA)>
<!ELEMENT orders (item)*>
<!ELEMENT item (product,number,price)>
<!ELEMENT product (#PCDATA)>
<!ELEMENT number (#PCDATA)>
<!ELEMENT price (#PCDATA)>
Cust.xml:
<!DOCTYPE document SYSTEM "extern.dtd">
<document>
<customer>
<name>
<firstname>aaa</firstname>
<lastname>bbb</lastname>
</name>
<date>1 jan 2021</date>
<orders>
<item>
<product>chocolates</product>
<number>666</number>
<price>250</price>
</item>

<item>
<product>sweets</product>
<number>777</number>
<price>450</price>
</item>
</orders>
</customer>
</document>
Output:

15. Write an XML for person information and access the data using XSL.
Ppl.xml:
<?xml-stylesheet type="text/xsl" href="people.xsl"?>
<people>
<person born="1982">
<name>
</name>
<profession>Project Lead</profession>
</person>
<person born="1980">
<name>
<firstname>ccc</firstname>
<lastname>ddd</lastname>
</name>
<profession>Project Manager</profession>
</person>
</people>
People.xsl:
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="html" omit-xml-declaration="no"/>
<xsl:template match="/">
<html>
<head>
<title>Presenting XML data</title>
</head>
<body>

<table border="2">
<tr>
<th>Born</th>
<th>Firstname</th>
<th>Lastname</th>
<th>Profession</th>
</tr>
<xsl:for-each select="people/person">
<tr>
<td><xsl:value-of select="@born"/></td>
<td><xsl:value-of select="name/firstname"/></td>
<td><xsl:value-of select="name/lastname"/></td>
<td><xsl:value-of select="profession"/></td>
</tr>
</xsl:for-each>
</table>
</body>
</html>
</xsl:template>
</xsl:stylesheet>
Output:


16. Write an XML for student information and access second students data using
DOM.
Schl.xml:
<school>
<class>
<class_title>XML</class_title>
<students>
<student>
</student>
<student>
</student>
</students>
</class>
</school>
School.html:
<html>
<head>
<title>Accessing XML data</title>
<script type="text/javascript">
function getStudentData()
{
var xmldoc;
xmldoc=new ActiveXObject("Microsoft.XMLDOM");
xmldoc.load("school.xml");
nodeSchool=xmldoc.documentElement;

nodeClass=nodeSchool.firstChild;
nodeStudents=nodeClass.lastChild;
nodeStudent=nodeStudents.lastChild;
nodeFirstname=nodeStudent.firstChild;
nodeLastname=nodeFirstname.nextSibling;
message.innerHTML="Name:"+nodeFirstname.firstChild.nodeValue+"
"+nodeLastname.firstChild.nodeValue;
}
</script>
</head>
<body bgcolor="pink">
<center>
<h1>Accessing XML Data</h1>
<div id="message"></div>
<input type="button" value="GET DATA" onClick="getStudentData()">
</center>
</body>
</html>
Output:

17. Write a program to display contents of XML file in a table using Extensible Style
Sheets ?
Book.xml:
<?xml:stylesheet type="text/xsl" href="book.xsl"?>
<book>
<bookinfo>
<title>C</title>
<authorname>Balaguru Swamy</authorname>
<isdnno>1234</isdnno>
<publisher>pearson</publisher>
<edition>4th</edition>
<price>$50</price>
</bookinfo>
<bookinfo>
<title>c++</title>
<authorname>Balaguru Swamy</authorname>
<isdnno>5678</isdnno>
<publisher>technical</publisher>
<edition>3rd</edition>
<price>$100</price>
</bookinfo>
</book>
Book.xsl:
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="html" omit-xml-declaration="no"/>
<xsl:template match="/">
<html>
<head>

<title>Book</title>
</head>
<body>
<center>
<table border="1" bgcolor=”grey”>
<thead >
<tr>
<th>title</th>
<th>authorname</th>
<th>isdnno</th>
<th>publisher</th>
<th>edition</th>
<th>price</th>
</tr>
</thead>
<xsl:for-each select="book/bookinfo">
<tr>
<td style="background-color:pink"><xsl:value-of select="title"/></td>
<td style="background-color:red"><xsl:value-of select="authorname"/></td>
<td style="background-color:green"><xsl:value-of select="isdnno"/></td>
<td style="background-color:purple"><xsl:value-of select="publisher"/></td>
<td style="background-color:brown"><xsl:value-of select="edition"/></td>
<td style="background-color:yellow"><xsl:value-of select="price"/></td>
</tr>
</xsl:for-each>
</table>
</center>
</body>
</html>
</xsl:template>

</xsl:stylesheet>
Output:

18. Write a simple servlet that displays a message.

FirstServlet.java:
import java.io.*;
import javax.servlet.*;
public class FirstServlet extends GenericServlet{
public void service(ServletRequest req,ServletResponse res)throws
ServletException,IOException{
res.setContentType("text/html");
PrintWriter pw=res.getWriter();
pw.println("<html><head><title>First Servlet</title></head>");
pw.println("<body><center><h1>This Message came from a
servlet</h1>");
pw.println("</center></body></html>");
pw.close();
}
}
Web.xml:
<web-app>
<servlet>
<servlet-name>abc</servlet-name>
<servlet-class>FirstServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>abc</servlet-name>
<url-pattern>/hello</url-pattern>
</servlet-mapping>
</web-app>
Output:


19. Write a servlet that reads parameters from employee login page.
Index.html:
<html>
<head>
<title>Servlet Parameters</title>
</head>
<body>
<center>
<form name="form1" method="POST"
action="http://localhost:9401/rpar/rparam">
<table>
<tr>
<td><b>Employee</td>
<td><input type="text" name="ename"
value=""></td>
</tr>
<tr>
<td><b>Id</td>
<td><input type="text" name="id" value=""></td>
</tr>
<tr>
<td><input type="submit" value="submit"></td>
<td><input type="reset" value="clear"></td>
</tr>
</table>
</form>
</center>
</body>
</html>
Rparam.java:

import java.io.*;
import java.util.*;
public class Rparam extends GenericServlet{
public void service(ServletRequest req,ServletResponse res)throws
Enumeration e=req.getParameterNames();
while(e.hasMoreElements()){
String pname=(String)e.nextElement();
pw.println("<b>"+pname+"=");
String pvalue=req.getParameter(pname);
pw.println("<b>"+pvalue);
}
pw.close();
}
}
Web.xml:
<web-app>
<servlet>
<servlet-name>rp</servlet-name>
<servlet-class>Rparam</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>rp</servlet-name>
<url-pattern>/rparam</url-pattern>
</servlet-mapping>
</web-app>
Output:


20. Write a servlet for creating a cookie and retrieving it.

Index.html:
<html>
<head>
<title> Cookies demo </title>
</head>
<body>
<center>
<form name="form1" method="POST" action="http://localhost:9401/cook/acook">
<b>Enter a value for my cookie:
<input type="text" name="data" size=25 value="">
<br><input type="submit" value="submit">
</form>
</center>
</body>
</html>
AddCookieServlet.java:
import java.io.*;
import javax.servlet.http.*;
public class AddCookieServlet extends HttpServlet
{
public void doPost (HttpServletRequest req, HttpServletResponse res)throws
ServletException,IOException
{
String data=req.getParameter("data");
Cookie cookie=new Cookie("MyCookie",data);
res.addCookie(cookie);
pw.println("<br>MyCookie has been sent to:");

pw.println(data);
pw.close();
}
}
GetCookieServlet.java:
import java.io.*;
public class GetCookieServlet extends HttpServlet
{
public void doGet (HttpServletRequest req, HttpServletResponse res)throws
ServletException, IOException
{
Cookie[] cookies=req.getCookies();
pw.println("<b>");
for(int i=0;i<cookies.length;i++)
{
String name=cookies[i].getName();
String value=cookies[i].getValue();
pw.println("name="+name+";value="+value);
}
pw.close();
}
}
Web.xml:
<web-app>
<servlet>
<servlet-name>ackk</servlet-name>

<servlet-class>AddCookieServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>ackk</servlet-name>
<url-pattern>/acook</url-pattern>
</servlet-mapping>
<servlet>
<servlet-name>gck</servlet-name>
<servlet-class>GetCookieServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>gck</servlet-name>
<url-pattern>/gcook</url-pattern>
</servlet-mapping>
</web-app>
Output:
Web page that accepts value for my cookie.
Servlet response that creates a cookie and adds it to the response:

Servlet that reads the cookie from request.

21. Write a servlet for session tracking.

DateServlet.java:
import java.io.*;
import java.util.*;
public class DateServlet extends HttpServlet{
public void doGet(HttpServletRequest req,HttpServletResponse res)throws
HttpSession hs=req.getSession(true);
pw.print("<b>");
Date d=(Date)hs.getAttribute("date");
if(d!=null){
pw.print("Last accessed date:"+d+"<br>");
}
d= new Date();
hs.setAttribute("date",d);
pw.print("current date:"+d);
pw.close();
}
}
Web.xml:
<web-app>
<servlet>
<servlet-name>sess</servlet-name>
<servlet-class>DateServlet</servlet-class>
</servlet>
<servlet-mapping>

<servlet-name>sess</servlet-name>
<url-pattern>/ddd</url-pattern>
</servlet-mapping>
</web-app>
Output:

22. Write a JSP that reads parameters from user login page.
Index.html:
<html>
<head>
<title>Login Page</title>
</head>
<body>
<h1 align=center>Login</h1>
<form name="form1" action="loginJsp.jsp" method="post">
<table>
<tr>
<td><b>UserName:</td>
<td><input type=txt name=t1></td>
</tr>
<tr>
<td><b>Password:</td>
<td><input type=password name=t2></td>
</tr>
<tr>
<td><input type=submit value=submit></td>
<td><input type=reset value=cancel></td>
</tr>
</table>
</form>
</body>
</html>
loginJsp.jsp:
<%@ page import="javax.io.*"%>
<%@ page import="javax.servlet.*"%>
<%@ page import="javax.servlet.http.*"%>

<%@ page import="javax.servlet.jsp.*"%>

<html>
<head>
<title>Login</title>
</head>
<body>
<%out.println("User Name is:"+request.getParameter("t1"));
out.println("Password is:"+request.getParameter("t2"));
%>
</body>
</html>
Output:
Login page to enter data:

JSP after submitting the data:

23. Write a JSP that reads a value, creates a cookie and retrieves it.
Index.html:
<html>
<body>
<form name="form1" action="second.jsp">
<b>Enter Value for cookie:
<input type="text" name="data" value="">
<br>
<input type="submit" value="Enter">
</body>
</html>
Second.jsp:
<%@page contentType="text/html" language="java"%>
<%
String data=request.getParameter("data");
Cookie cookie=new Cookie("Mycookie",data);
cookie.setMaxAge(60*60);
response.addCookie(cookie);
out.print("<b> Cookie value:"+data);
%>
<html>
<body>
<a href="third.jsp">Click here</a> to see the cookie's data
</body>
</html>
Third.jsp:
<%@page session="false"%>
<html>
<body>
<%

Cookie[] cookies = null;

cookies = request.getCookies();
if( cookies != null ){
for (int i = 0; i < cookies.length; i++){
out.print("Name : " + cookies[i].getName() + ", ");
out.print("Value: " + cookies[i].getValue()+" <br>");
}
}else{
out.println("<h2>No cookies founds</h2>");
}
%>
</body>
</html>
Output:
Web page that accepts cookie value:
JSP that reads and creates a cookie:

JSP that reads a cookie from the request:

24. Write a JSP for session tracking.

<%@ page import="java.io.*,java.util.*" %>
<%
Date createTime = new Date(session.getCreationTime());
Date lastAccessTime = new Date(session.getLastAccessedTime());
%>
<html>
<head>
<title>Session Tracking</title>
</head>
<body>
<center>
<h1>Session Tracking Example</h1>
</center>
<table border="1" align="center">
<tr bgcolor="#ffcccc">
<th>Session info</th>
<th>Value</th>
</tr>
<tr >
<td>id</td>
<td><% out.print( session.getId()); %></td>
</tr>
<tr>
<td>Creation Time</td>
<td><% out.print(createTime); %></td>
</tr>
<tr>
<td>Time of Last Access</td>
<td><% out.print(lastAccessTime); %></td>

</tr>
</table>
</body>
</html>
Output:

25. Write a servlet that connects to the database and retrieves the data and displays
it.
Index.html:
<html>
<body>
<form action="show" method="post">
<font face="verdana" size="2">
Enter Table Name :<input type="text" name="table">
<input type="submit" value="Display">
</font>
</form>
</body>
</html>
ServletDatabaseConnect.java:
import java.io.IOException;
import java.io.PrintWriter;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.ResultSet;
import java.sql.Statement;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
public class ServletDatabaseConnect extends HttpServlet

{
protected void doPost(HttpServletRequest req,HttpServletResponse res)throws
ServletException,IOException

{
String tb=req.getParameter("table");
try
{
Class.forName("oracle.jdbc.driver.OracleDriver");
Connection
con=DriverManager.getConnection("jdbc:oracle:thin:@localhost:1521:XE","nvn","nvn")
;
Statement st=con.createStatement();
System.out.println("connection established successfully...!!");
ResultSet rs=st.executeQuery("select * from "+tb);
pw.println("<table border=1>");
pw.println("<tr><th>Username</th><th>Password</th></tr>");
while(rs.next())
{
pw.println("<tr><td>"+rs.getString(1)+"</td><td>"+rs.getString(2)+"</td></tr>");
}
pw.println("</table>");
pw.close();
}
catch (Exception e){
e.printStackTrace();
}

}
}
Web.xml:
<web-app>
<servlet>
<servlet-name>ServletDBConnect</servlet-name>
<servlet-class>ServletDatabaseConnect</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>ServletDBConnect</servlet-name>
<url-pattern>/show</url-pattern>
</servlet-mapping>
</web-app>

(AUTONOMOUS)
Evaluation Procedure for Internal Laboratory Examinations:
1. Of the 25 marks for internal, 10 marks will be awarded for day-to-day work and 10 marks
to be awarded for the Record work and 5 marks to be awarded by conducting an internal
laboratory test.
2. Concerned Teachers have to do necessary corrections with explanations.
3. Concerned Lab teachers should enter marks in index page.
4. Internal exam will be conducted by two Staff members.
Dr.K. Subba Reddy

Professor & Head Dept. of CSE.
(AUTONOMOUS)
Evaluation Procedure for External Laboratory Examinations:
1. For Practical subjects there is a continuous evaluation during the semester for 25 Sessional
marks and 50 end examination marks.
2. The end examination shall be conducted by the teacher concerned (Internal Examiner) and
another External Examiner, recommended by Head of the Department with the approval of
principal.
Evaluation procedure for external lab examination:

1. Procedure for the program ---------- 20M
2. Execution of the program ---------- 15M
3. Viva voce ---------- 15M
----------------------------
Total 50M
-----------------------------
Dr.K. Subba Reddy

Professor & Head Dept. of CSE.

WT Lab

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

WT Lab

Uploaded by

Copyright:

Available Formats

RAJEEV GANDHI MEMORIAL COLLEGE OF ENGG.& TECH.

III B.TECH-II SEM

VISION OF THE DEPARTMENT

 To empower students with cutting edge technologies in computer science

 To train the students as entrepreneurs in computer science and

 To develop smart applications to disseminate information to rural people

MISSION OF THE DEPARTMENT

 To become the best computer science and engineering department in the

 To incubate, apply and spread innovative ideas by collaborating with

 To provide exposure to the students in the latest tools and technologies to

Logo Web Site Name

Logo Web Site Name

Detailed Syllabus 113

Book : HTML in 24 hours

Detailed Syllabus 114

Detailed Syllabus 115

<b class="headline">This is headline style bold</b>

3) Control the repetition of the image with the background-repeat property.

Detailed Syllabus 116

Detailed Syllabus 117

DEPT OF CSE, RGMCET 2

18. Write a simple servlet that displays a message.

DEPT OF CSE, RGMCET 3

1. Write a HTML program for the demonstration of Lists.

DEPT OF CSE, RGMCET 4

DEPT OF CSE, RGMCET 5

DEPT OF CSE, RGMCET 6

DEPT OF CSE, RGMCET 7

2. Write a HTML program for demonstrating Hyperlinks.

DEPT OF CSE, RGMCET 8

Navigation within the page:

DEPT OF CSE, RGMCET 9

DEPT OF CSE, RGMCET 10

3. Write a HTML program for time-table using tables.

DEPT OF CSE, RGMCET 11

DEPT OF CSE, RGMCET 12

DEPT OF CSE, RGMCET 13

DEPT OF CSE, RGMCET 14

4. Write a HTML program to develop a static Home Page using frames.

DEPT OF CSE, RGMCET 15

5. Write a HTML program to develop a static Registration Form.

DEPT OF CSE, RGMCET 16

DEPT OF CSE, RGMCET 17

DEPT OF CSE, RGMCET 18

<input name="rb3" type="radio" value="radiobutton">IT

DEPT OF CSE, RGMCET 19

DEPT OF CSE, RGMCET 20

6. Write a HTML program to develop a static Login Page.

DEPT OF CSE, RGMCET 21

DEPT OF CSE, RGMCET 22

7. Write a HTML program to develop a static Web Page for Catalog.

DEPT OF CSE, RGMCET 23

<td><input type="button"value="add to cart"></td>

DEPT OF CSE, RGMCET 24

DEPT OF CSE, RGMCET 25

DEPT OF CSE, RGMCET 26

9. Write HTML for demonstration of cascading stylesheets.

DEPT OF CSE, RGMCET 27

DEPT OF CSE, RGMCET 28

DEPT OF CSE, RGMCET 29

DEPT OF CSE, RGMCET 30

10. Write a javascript program to validate USER LOGIN page.

DEPT OF CSE, RGMCET 31