WT Lab Manual

Web Technology
Laboratory Manual
III YEAR B.TECH (II - SEM)

(CSE/IT)
Department of Computer Science & Engineering
1
PREFACE
Web Technology is one of the important subjects included in the third year
curriculum by JNTUH. In addition to theory subject also includes Web technology as
lab practical’s using different languages and technologies like HTML,Java
Script,XML,Servlets and JSPs
HyperText Markup Language (HTML), the markup scheme used to prepare a wide
range of documents for dissemination via the World Wide Web. Although HTML has been
around for some time now, it is only recently that it has been formalized and its syntax and
semantics set down in a consistent--and machine-verifiable—format.HTML is used to create
web pages.
JavaScript was first introduced as part of Netscape Navigator in 1996. JavaScript’s
original goal was to improve the user experience of web pages. Instead of going back to the
server for simple tasks such as form validation, JavaScript allowed embedding of this
functionality directly in the page. JavaScript (JS) is an interpreted computer programming
language. As part of web browsers, implementations allow client-side scripts to interact with
the user, control the browser, communicate asynchronously, and alter the document content
that is displayed.
Extensible Markup Language (XML) is a markup language that defines a set of rules for
encoding documents in a format that is both human-readable and machine-readable. It is
defined in the XML 1.0 Specification produced by the W3C, and several other related
specifications, all free open standards.
The servlet is a Java programming language class used to extend the capabilities of a
server. Although servlets can respond to any types of requests, they are commonly used to
extend the applications hosted by web servers, so they can be thought of as Java Applets that
run on servers instead of in web browsers. These kinds of servlets are the Java counterpart to
other dynamic Web content technologies such as PHP and ASP.NET.
Java Server Pages (JSP) is a technology that helps software developers create
dynamically generated web pages based on HTML, XML, or other document types. Released in
1999 by Sun Microsystems, JSP is similar to PHP, but it uses the Java programming language.
JDBC is a Java-based data access technology (Java Standard Edition platform) from
Oracle Corporation. This technology is an API for the Java programming language that defines
how a client may access a database. It provides methods for querying and updating data in a
database. JDBC is oriented towards relational databases. A JDBC-to-ODBC bridge enables
connections to any ODBC-accessible data source in the JVM host environment.
2
LAB CODE
1. Students should report to the concerned lab as per the time table.
2. Students who turn up late to the labs will in no case be permitted to do the program
schedule for the day.
3. After completion of the program, certification of the concerned staff in-charge in the
observation book is necessary.
4. Student should bring a notebook of 100 pages and should enter the readings
/observations into the notebook while performing the experiment.
5. The record of observations along with the detailed experimental procedure of the
experiment in the immediate last session should be submitted and certified staff member
in-charge.
6. Students should be present in the labs for total scheduled duration.
7. Students are required to prepare thoroughly to perform the experiment before coming to
laboratory.
8. Students are supposed to occupy the machines allotted to them and are not
supposed to talk or make noise in the lab. The allocation is put up on the lab
notice board.
9. Lab can be used in free time / lunch hours by the students who need to use the
systems should take prior permission from the lab in-charge.
10. Lab records need to be submitted on or before date of submission.
11. Use of computer network is encouraged.
3
INDEX
SNO Experiment Name of the Experiment Page No

NO
1 JNTU Syllabus 6-16
Objective , Hardware Software

2 Requirement, 17
Online Book Store – 18-29
3 1 Part1
Online Book Store – 30-37
Part2
4 2
Validation 38-43
5 3
Cascading Style Sheet 44-51
6 4
eXtensible Markup 52-60
Language
7 5
Visual Bean 61-67
8 6
Web Servers 68-71
9 7
User Authentication 78-79
10 8
JDBC – User 80-86
Registration
11 9
JSP Development 87-91
12 10
JDBC – Catalogue 92-96
13 11
HTTP 97-103
14 12
4
WEB TECHNOLOGIES LAB
JNTU SYLLABUS
Objective :
To create a fully functional website with mvc architecture. To Develop an online Book store
using we can sell books (Ex amazon .com).
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
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.
5
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:
Web Site Name
Logo
CSE
ECE Login :
EEE Password:
CIVIL ese
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:
Snap shot of Cover Page.
6
Author Name. Publisher. Price. Add to cart button.
Web Site Name
Logo
CSE Book : XML

Bible
$ 40.5
Author : Winston
ECE
Publication : Wiely
EEE
Book : AI $ 63
Author : S.Russel
CIVIL
Publication :
Princeton hall
Book : Java 2 $ 35.5
Author : Watson
Publication : BPB
publications
Book : HTML in $ 50
24 hours
Author : Sam Peter
Publication : Sam
publication
7
Note: Week 2 contains the remaining pages and their description.
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:
Web Site Name
Logo
CSE Book name Price Quantity Amount
ECE
EEE Java 2 $35.5 2 $70
CIVIL XML bible $40.5 1 $40.5
Total amount - $130.5
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)
8
6) Date of birth (3 select boxes)
7) Languages known (check boxes – English, Telugu, Hindi, Tamil)
8) Address (text area)
WEEK 3:
VALIDATION:
Write JavaScript to validate the following fields of the above registration page.
Name (Name should contains alphabets and the length should not be less than 6 characters).
Password (Password should not be less than 6 characters length).
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).
Note : You can also validate the login page with these parameters.
Week-4:
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>
9
<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>
</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);}
10
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>
5) Work with layers:
For example:
LAYER 1 ON TOP:
<div style="position:relative; font-size:50px; z-index:2;">LAYER 1</div>
<div style="position:relative; top:-50; left:5; color:red; font-size:80px; z-
index:1">LAYER 2</div>
LAYER 2 ON TOP:
6) Add a customized cursor:
For example:
<html>
<head>
11
.hlink{cursor:help}
</style>
</head>
<body>
<b>
<br>
</b>
</body>
</html>
Week-5:
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
Write a Document Type Definition (DTD) to validate the above XML file.
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.
12
Note: Give at least for 4 books. It should be valid syntactically.
Hint: You can use some xml editors like XML-spy
Week-6:
VISUAL BEANS:
Create a simple visual bean with a area filled with a color.
The shape of the area depends on the property shape. If it is set to true then the shape of the area
is Square and it is Circle, if it is false.
The color of the area should be changed dynamically for every mouse click. The color should
also be changed if we change the color in the “property window “.
Week-7:
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.
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.
Access the pages by using the urls : http://localhost:4040/rama/books.html (for tomcat)
http://localhost:8080/books.html (for Apache)
Week-8:
User Authentication :
Assume four users user1,user2,user3 and user4 having the passwords pwd1,pwd2,pwd3 and
pwd4 respectively. Write a servelet for doing the following.
1. Create a Cookie and add these four user id’s and passwords to this Cookie.
2. Read the user id and passwords entered in the Login form (week1) and authenticate with the
values (user id and passwords ) available in the cookies.
If he is a valid user(i.e., user-name and password match) you should welcome him by name(user-
name) else you should display “ You are not an authenticated user “.
13
Use init-parameters to do this. Store the user-names and passwords in the webinf.xml and access
them in the servlet by using the getInitParameters() method.
Week-9:
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.
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-10:
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 ( similar to week8 instead of cookies).
Week-11:
Create tables in the database which contain the details of items (books in our case like Book
name , Price, Quantity, Amount )) of each category. Modify your catalogue page (week 2)in
such a way that you should connect to the database and extract data from the tables and display
them in the catalogue page using JDBC.
Week-12:
HTTP is a stateless protocol. Session is required to maintain the state.
The user may add some items to cart from the catalog page. He can check the cart page
for the
14
selected items. He may visit the catalogue again and select some more items. Here our interest is
the selected items should be added to the old cart rather than a new cart. Multiple users can do
the same thing at a time(i.e., from different systems in the LAN using the ip-address instead of
localhost). This can be achieved through the use of sessions. Every user will have his own
session which will be created after his successful login to the website. When the user logs out his
session should get invalidated (by using the method session.invalidate() ).
Modify your catalogue and cart JSP pages to achieve the above mentioned functionality
using sessions.
15
OBJECTIVE
To create a fully functional website with mvc architecture. To Develop an online

Book store using we can sell books (Ex amazon .com).
HARDWARE AND SOFTWARE REQUIRED

1. A working computer system with either Windows or Linux
2. A web browser either IE or firefox
3. Sun Java Version 1.5 or above
4. Eclipse IDE
5.
6. Tomcat weblike
XML editor server andXml-spy
Altova Apache[www.Altova.com/XMLSpy
web server
7. A database either Mysql or Oracle
8. JVM(Java virtual machine) must be installed on your system
9. BDK(Bean development kit) must be also be installed
TO STUDENTS
Dear Students,
This course is to enable hands on experiences on Web Based Application

Development in Java. This Book contains the stepwise algorithm for all the
experiments as per JNTU syllabus applicable for B.TECH Computer Science &
Engineering, Information Technology, although in real time execution, the
industry-oriented approach will be adapted along with that. Complete code is
available in my personal website for all the experiments. During the Lab, all the
students will create their individual folder by their Hall Ticket number and will
take at least one monthly backup.
16
EXPERIMENT NO: 1
Name of the Experiment: Online Book Store – Part1
AIM: Design the static web pages required for an online bookstore web site.
THEORY:
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.
Web Site
Name
Logo
CSE
ECE Description of the Web Site
EEE
CIVIL
Fig 1.1
2) LOGIN PAGE:
17
This page looks like below:
Web Site Name

Logo
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
CSE Book : XML
18
Bible $ 40.5
ECE Author :
Winston
Publication :
EEE Wiely
CIVIL Book : AI $ 63
Author :
S.Russel
Publication :
Princeton hall
Book : Java 2 $ 35.5
Author : Watson
Publication :
BPB
publications
Book : HTML $ 50
in 24 hours
Author : Sam
Peter
Publication :
Sam publication
ALGORITHM:
1. Create the Blank Pages
19
2. Create the frames
3. Create Individual pages for links and data part
4. Set the link target in middle frame
5. In Home Page, set the Logo and the Page Title
6. Design the remaining pages as per the description
OUT PUT :
Figure 1 home page
20
Figure 2 Login Page
Figure 3 Catalogue page
INFERENCE:
Internet web browser is available in your system and its enable to bypass
the proxies for local address.
21
APPLICATIONS:
Standard front end for all web based application
EXTENSION:
With the help of cascading style sheet, the look and feel could be better, which you will do
in Experiment 4.
VIVA QUESTION AND ANSWERS:
1. What does HTML stand for?

a)Hyperlinks and Text Markup Language
b)Home Tool Markup Language
c)Hyper Text Markup Language
2. Who is making the Web standards?

a)Mozilla
b)Microsoft
c)The World Wide Web Consortium
3) Choose the correct HTML tag for the largest

heading
a)<heading> b)<head> c)<h6> d)<h1>
4)What is the correct HTML tag for inserting a line break?

a) <lb /> b)<br/>
c)<break >
5)What is the correct HTML for adding a background color?

a)<body bgcolor="yellow">
b)<body style="background-color:yellow">
c)<background>yellow</background>
6)Choose the correct HTML tag to make a text bold

a)<b>
b)<bold>
22
c)<bd>
7.Choose the correct HTML tag to make a text italic

a)<italic> b)<i> c))<itl> d)none
8.What is the correct HTML for creating a hyperlink?

a)<a href="http://www.w3schools.com">W3Schools</a>
b)<a name="http://www.w3schools.com">W3Schools.com</a>
c)<a>http://www.w3schools.com</a>
d)<a url="http://www.w3schools.com">W3Schools.com</a>
9.How can you create an e-mail link?

a)<mail href="xxx@yyy">
b)<a ref="xxx@yyy">
c)<a href="mailto:xxx@yyy">
d)<mail>xxx@yyy</mail>
10. How can you open a link in a new browser window?

a)<a href="url" new>
b)<a href="url" target="new">
c)<a link=”url” new>
23
EXPERIMENT NO: 2
Name of the Experiment: Online Book Store – Part2
AIM: Design the static web pages required for an online bookstore web site.
THEORY:
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:

Web Site Name
Logo
CSE Book name Price Quantity Amount

ECE
EEE Java 2 $35.5 2 $70
CIVIL XML bible $40.5 1 $40.5
Total $13
amount - 0.5
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)
24
7) Languages known (check boxes – English, Telugu, Hindi, Tamil)
8) Address (text area)
ALGORITHM:
1. Continue from the Experiment 1
2. Create the Blank Pages
3. Create the frames
4. Create Individual pages for links and data part
5. Set the link target in middle frame
6. Design the remaining pages as per the description
1.
OUTPUT:
Figure 1 Registration page
25
Figure 2 Cart page
INFERENCE:
Internet web browser is available in your system and its enable to bypass the proxies for
local address.
APPLICATIONS:
Standard front end for all web based application.
EXTENSION:
With the help of cascading style sheet, the look and feel could be better, which you will do
in Experiment 4.
1. Which of these tags are all <table> tags?

a)<table><tr><tt>
b)<table><tr><td>
c)<table><head><tfoot>
d)<thead><body><tr>
2.Choose the correct HTML to left-align the content inside a tablecell

a)<td left>
26
b)<td leftalign>
c)<td align="left">
d)<td valign="left">
3.How can you make a list that lists the items with numbers?
a)<list>
b)<dl>
c)<ol>
d)<ul>
4.How can you make a list that lists the items with bullets?
a)<list> b)<dl>
c) <ol> d)<ul>
5.What is the correct HTML for making a heckbox?

a)<input type="checkbox" />
b)<check>
c)<input type="check" />
d)<checkbox>
EXPERIMENT NO: 3
Name of the Experiment: Validation
AIM: Using JavaScript to validate fields of the above registration page.

THEORY:
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).
ALGORITHM:
27
1. Continue from the Experiment 2
2. Define the functions for Scripts
3. Set Alerts for all the codes.
OUT PUT:
Figure 3 Enter valid user name(min 6 chars)
28
Figure 4 pwd must not same as uname
Figure 5 Email id should be in correct form
29
Figure 6 phone number in 999-999-9999 format
INFERENCE:
local address.
APPLICATIONS:
EXTENSION:
You can also validate the login page with these parameters.

1. Inside which HTML element do we put the JavaScript?
a)<script> b)<js> c)<javascript> d)<scripting>
2. What is the correct JavaScript syntax to write "Hello World"? ("Hello World")
a)document.write("Hello World")
b)"Hello World"
c)response.write("Hello World")
30
3. Where is the correct place to insert a JavaScript? Both the <head> section and the
<body> section are correct
a)The <head> section b)The <body> section
4. 4.What is the correct syntax for referring to an external script called

"xxx.js"? a)<script name="xxx.js">
b)<script href="xxx.js">
c)<script src="xxx.js">
5. An external JavaScript must contain the <script> tag

True
False
6. How do you write "Hello World" in an alert box?

a)alert("Hello World")
b)msgBox("HelloWorld")
c)alertBox="HelloWorld"
d)alertBox("Hello World")
7. How do you create a function?

a)function a)myFunction()
b)function=myFunction()
c)function myFunction()
8. How do you call a function named "myFunction"?

a)myFunction()
b)call function myFunction
c)call myFunction()
9. How do you write a conditional statement for executing some code if "i" is
equal to 5? if i=5 then
a)if
b) i=5
b)if (i=5)
c)if i=5 then
d)none
10. How do you write a conditional statement for executing some code if "i" is NOT
equal to 5?
a)if <>5
31
b)if (i <> 5)
c)if =! 5 then
d) if (i != 5)
EXPERIMENT NO: 4
Name of the Experiment: Cascading Style Sheet
AIM: Design a web page using CSS.

THEORY:
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>
B.headline {color:red; font-size:22px; font-family:arial; text-decoration:underline}
</style>
</HEAD>
<BODY>
<b>This is normal bold</b><br>
For example:
<html>
<head>
.hlink{cursor:help}
</style>
</head>
<body>
<b>
<br>
32
</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>
5) Work with layers:
For example:
33
LAYER 1 ON TOP:
LAYER 2 ON TOP:
6) Add a customized cursor:
For example:
<html>
<head>
.hlink{cursor:help}
</style>
</head>
<body>
<b>
<br>
</b>
</body>
</html>
ALGORITHM:
1. Create the Blank Page
2. Define the Style Tag
34
3. Define the body properties
4. Set the back ground Image using background-image tag
5. Define the Hyper link properties using
A:link {color: red; cursor:crosshair;}

A:visited {color: blue; cursor:wait;}
A:active {color: green; cursor: help;}
A:hover {color: navy; cursor: inherit;}
6. Test the layers using the following
<div style="position:relative; font-size:50px; z-index:3;">LAYER 1</div> <div style="position:relative; top:-50;

left:5; color:red;
font-size:80px; z-index:4">LAYER 2</div>
Figure 7 internal css
35
Figure 8 Embedded CSS
INFERENCE:
local address.
APPLICATIONS:
EXTENSION:
You can also use some animation for the web page.
VIVA QUESTION :
1. What is CSS?
2. What are Cascading Style Sheets?
3. How do I center block-elements with CSS1?
4. If background and color should always be set together, why do they exist as
separate properties?
5. What is class?
6. What is grouping?
36
7. What is external Style Sheet? How to link?
8. Is CSS case sensitive?
9. Three selectors: h1, .warning and #footer, what they do ?
10.What are Style Sheets? 11.What

is CSS rule 'ruleset'?
12.What is embedded style? How to link?

13.What is ID selector?
14.What is contextual selector?
15.How do I have a background image that isn't tiled?

16.Why do style sheets exist?
37
EXPERIMENT NO: 5
Name of the Experiment: eXtensible Markup Language
AIM: Write an XML file which will display the Book information.
THEORY:
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
Write a Document Type Definition (DTD) to validate the above XML file.
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.
ALGORITHM:
1. Write down the Document type Definition as per the requirement
2. Create dtd file
3. Using dtd syntax create a xnml document
4. Create xsl file i.i xml schema file
5. Using XML xchema file create an xml document
38
OUT PUT :
Figure 9 Using External DTD
Figure 10 Using Internal Dtd
39
INFERENCE:
local address. Java Script should be enabled for your web Browser.
APPLICATIONS:
EXTENSION:
Give at least for 4 books. It should be valid syntactically.
VIVA QUESTION :
1. What does XML stand for?
a)eXtensible Markup Language
b)Example Markup Language
c)eXtra Modern Link
d)X-Markup Language
40
2. There is a way of describing XML data, how? XML uses XSL to describe
data
a)XML uses a description node to describe data
b)XML uses a DTD to describe the data
c)none
3. XML's goal is to replace HTML

False/ True
4. What is the correct syntax of the declaration which defines the XML version?
a)<xml version="1.0" />
b)<?xml version="1.0" />
c)<?xml version="1.0"?>
d)none
5. What does DTD stand for?

a)Do The Dance
b)Dynamic Type Definition
c)Document Type Definition
d)Direct Type Definition
6. Is this a "well formed" XML document? <?xml

version="1.0"?>
<note>
<to>Tove</to>
<from>Jani</from>
<heading>Reminder</heading>
<body>Don't forget me this weekend!</body>
</note>
Yes No
7. Is this a "well formed" XML document?

<?xml version="1.0"?> <to>Tove</to>
<from>Jani</from>
<heading>Reminder</heading>
<body>Don't forget me this weekend!</body>
No Yes
8. Which statement is true?

a)All XML documents must have a DTD
b)All the statements are true
41
c)All XML elements must be properly closed
d)All XML elements must be lower case
9. Which statement is true?

A)XML tags are case sensitive
b)All the statements are true
c)XML elements must be properly nested
d)XML documents must have a root tag
10. XML preserves white spaces

False
True
42
EXPERIMENT NO: 6
Name of the Experiment: Visual Bean
AIM: Create a simple visual bean.
THEORY:
Create a simple visual bean with an area filled with a color.
The shape of the area depends on the property shape. If it is set to true then the shape of the area is
Square and it is Circle, if it is false.
The color of the area should be changed dynamically for every mouse click. The color should also
be changed if we change the color in the “property window “.
ALGORITHM:
1. Create a directory for the new Bean.
2. Create the Java source file(s).
3. Compile the source file(s).
4. Create a manifest file.
5. Generate a JAR file.
6. Start the BDK.
7. Test.
OUTPUT:
43
INFERENCE:
Java Runtime Environment should be enabled.
APPLICATIONS:
Standard front end for all windows based application.
EXTENSION:
Design a Color Picker.

1. Which of the following is true?
A.A bean must be a public class.
B. A bean must have a public no-arg constructor.
C. A bean cannot have any constructors with parameters.
D.A bean must implement the java.io.Serializable interface to ensure a persistent state.
2 Which of the following is true?

A.A bean must provide an accessor method for each data field in the class.
B. A bean must provide a mutator method for each data field in the class.
C. A bean must provide both accessor method and mutator method for each data field
in the
class.
D.A bean property must be defined as a data field.
E. Every Java GUI component is a JavaBeans component.
3 The signature for the accessor method of a Date property birthDate should be
__________.
A.public java.util.Date birthDate()
B. public java.util.Date getbirthDate()
C. public java.util.Date getBirthDate()
44
D.private java.util.Date birthDate()
E. private java.util.Date getBirthDate()
4 The signature for the mutator method of a Date property birthDate should be
__________.
A.public void birthDate()
B. public void setbirthDate()
C. public void setBirthDate(java.util.Date date)
D.public void birthDate(java.util.Date date)
5 The signature for the accessor method of a Boolean property visible should be
__________.
A.public boolean getVisible()
B. public boolean isVisible()
C. public static boolean isVisible()
D.public boolean visible()
E. private boolean isVisible()
6 An event and its corresponding listener is referred to as ____________.

A.an event set
B. an event pair
C. an event object
D.an event class
7 Any event is an instance of _________.

A.java.util.EventObject
B. java.awt.Component
C. javax.swing.JComponent
D.java.awt.ActionEvent
8 Any listener is an instance of _________.
45
A.java.util.EventListener
B. java.awt.ActionListener
C. javax.swing.JComponent
D.java.util.EventObject
9 The signature for the registration method for an ActionEvent should be __________.
A.public void setActionListener(ActionListener l)
B. public void addActionListener(ActionListener l)
C. public void addActionListener(ActionEvent l)
D.public void setAction(ActionListener l)
46
EXPERIMENT NO: 7
Name of the Experiment: Web Servers
AIM: Web Server Installation, configuration and Testing.

THEORY:
1) 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.
2) 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.
Access the pages by using the urls :http://localhost:8080/books.html (for Apache tomcat)
ALGORITHM:
1. Extract the Apache Tomcat zip file to C:\Apache Folder.
2. Right click on My Computer and choose Properties.
3. Click on Advanced.
4. Click on Environment Variables.
5. Click on user Variables and Click on new
47
6. Create two new variables as follows:
JAVA_HOME with value C:\Program Files\Java\jdk1.6.3 &
JRE_HOME with value C:\Program Files\Java\jre1.6.3
7. Go to C:\apache\bin and run the startup.bat file.
8. Go to web browser and ask for the url as http://localhost:8080/, the
apache home page will be displayed.
9. Now go to C:\apache\webapps\ROOT and create a folder as demo.
10.Create a sample html file as home.html and access from the web browser as
http://localhost:8080/test/sample.html
INPUT:
In the web browser enter the following address http://localhost:8080/test/sample.html
OUTPUT:
INFERENCE:
local address.
APPLICATIONS:
Web based application management.
48
EXTENSION:
You can also deploy complete assignment 1.

1. JSP files end with __________.
A. .java extension B. .html extension
C. .shtml extension D. .jsp extension
2 You can run JSP from _____________.
A.any Web server.

B. any JVM.
C. any Web server that supports Java servlet and JSP.
D.any Web browser.
3 Which of the following statements are true?
A.JSP is translated into Java servlet by a Web server when a JSP is called.
B. JSP is translated into HTML by a Web server when a JSP is called.
C. JSP is translated into XML by a Web server when a JSP is called.
D.YOu can embed Java code in JSP.
4 _______________ is a JSP expression.

A.<%= i %>
B. <%= Math.pow(2, 3) %>
C. <%= new Date().toString() %>
D.<% for (int i = 0; i <= 10; i++) { %>
5 _______________ is a JSP scriptlet.
A.<%= i %>
B. <%= Math.pow(2, 3) %>
C. <%! private long computeFactorial(int n) { if (n == 0)return 1;else return n *
computeFactorial(n - 1); } %>
D.<% for (int i = 0; i <= 10; i++) { %>
E. 
7 _______________ is a JSP comment.

A.<%= i %>
B. <%-- i --%>
C. <%! private long computeFactorial(int n) { if (n == 0) return 1; else return n *

D.<% for (int i = 0; i <= 10; i++) { %>
E. 
EXPERIMENT NO: 8
Name of the Experiment: User Authentication
AIM: To Accessing cookies from Servlet Code.
THEORY:
Assume four users user1,user2,user3 and user4 having the passwords pwd1,pwd2,pwd3 and pwd4
respectively. Write a servelet for doing the following.
1. Create a Cookie and add these four users’ ids and passwords to this Cookie.
2. Read the user id and passwords entered in the Login form (week1) and authenticate with the
values (user id and passwords) available in the cookies.
If he is a valid user(i.e., user-name and password match) you should welcome him by name(user-
name) else you should display “ You are not an authenticated user “.
We can use init-parameters to do this. Store the user-names and passwords in the webinf.xml and
access them in the servlet by using the getInitParameters() method.
50
STEPS TO DEVELOP A WEB-APPLICATION IN ENTERPRISE EDITION
1. Create the workspace to place the web-resources, this workspace is technically

referred as root of the web-application, document root or a context
2. Create a directory with the name WEB-INF, this directory holds the Information
about the web-application.
3. Develop a deployment descriptor(web.xml),it

contains the information about the web-
resource(servlets).These web-resources have to be placed in respective folders in
the document root.
4. Start the Web-server Tomcat
5. In commandPrompt:
C:\Program Files\Apache Software Foundation\Tomcat6.0\bin\tomcat6.exe
6. Open the browser and type following at address
bar http://localhost:8080
7. Click on Tomcat manager then provide

username and if required provide password
8. Then type the following on address bar http://localhost:8080/abcd/url-pattern
51
Deploying the web application structure:
Create the following structure under tomcat/web-apps folder
ALGORITHM:
1. Create the page to enter the values.
2. Create a Servlet to set the cookie.
3. Create the page to enter the new set of values for verification.
4. Create a Servlet to get the values and verify them.
52
OUT PUT:
INFERENCE:
local address.
APPLICATIONS:
EXTENSION:
53
Apply the cookies for Session tracking.
VIVA QUESTIONs :
1. State the benefits and drawbacks of adopting a web framework in designing a

Java EE application.
2. What is servlet?
3. What is HTTp Request?
4. Define Cookie
5. Explain how the Java EE platform enables service oriented architecture (SOA) -
based applications
EXPERIMENT NO: 9
Name of the Experiment: JDBC – User Registration
AIM: 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).
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 .
THEORY:
1. Install a database(Mysql or Oracle).
2. 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).
3. Practice 'JDBC' connectivity.
4. 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.
5. 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)..
ALGORITHM:
54
1. Create table USERDATA
2. Insert three rows
3. Create a page to display the Data
4. First Load the class for Oracle JDBC
Class.forName("oracle.jdbc.driver.OracleDriver").newInstance() ;
5. Create the Connection
DriverManager.getConnection("jdbc:oracle:thin:@SystemName:
PortNumber:DatabaseName","userId","Password");
6. Then Prepare statement
con.prepareStatement(qur)
7. Then Execute the query
ps.executeQuery();
OUTPUT:
The Data will be available in database.
55
INFERENCE:
56
local address.
APPLICATIONS:
For all your applications, this JDBC code will be applicable.
EXTENSION:
You can now make the entire application dynamic.

1. Which statements about JDBC are true? (2 answers)
[a] JDBC is an API to connect to relational-, object- and XML data sources
[b] JDBC stands for Java DataBase Connectivity
[c]JDBC is an API to access relational databases, spreadsheets and flat files
[d]JDBC is an API to bridge the object-relational mismatch between OO programs and
relational databases
2. Which packages contain the JDBC classes?

(a) java.jdbc and javax.jdbc
(b) java.jdbc and java.jdbc.sql
(c)java.sql and javax.sql
(d) java.rdb and javax.rdb
3. Which type of driver provides JDBC access via one or more ODBC drivers?
(a) Type 1 driver
(b) Type 2 driver
(c)Type 3 driver
(d) Type 4 driver
4. Which type of driver converts JDBC calls into the network protocol used by the
database management
system directly?
(a) Type 1 driver
(b) Type 2 driver
(c)Type 3 driver
(d) Type 4 driver
5. Which type of Statements can execute parameterized queries?
(a) PreparedStatement
(b) ParameterizedStatement
(c)ParameterizedStatement and CallableStatement
(d) All kinds of Statements (i.e. which implement a sub interface of Statement)
EXPERIMENT NO: 10
57
Name of the Experiment: JSP Development.
AIM: Write a JSP that retrieves the user data in database.

THEORY:
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 (similar to week8 instead of cookies).
ALGORITHM:
1. Create a page to display the Data
Class.forName("oracle.jdbc.driver.OracleDriver").newInstance() ;
DriverManager.getConnection("jdbc:oracle:thin:@SystemName:
PortNumber:DatabaseName","userId","Password");
ps.executeQuery();
OUT PUT:
58
59
INFERENCE:
Internet web browser is available in your system and its enable to bypass the proxies
for local address.
APPLICATIONS:
EXTENSION:
VIVA QUESTIONS
1)What is JSP?
2)Write 2 implicit objects with synax?
3)what are the elements of jsp?
4)write a syntax for JDBC type 1 driver?
5)Write a methods to connect to Database?
EXPERIMENT NO: 11
Name of the Experiment: JDBC – Catalogue
AIM: Write a servlet that stores the user data in database and retrieve also.
THEORY:
Create tables in the database which contain the details of items (books in our case like Book
name , Price, Quantity, Amount )) of each category. Modify your catalogue page (week 2)in
such a way that you should connect to the database and extract data from the tables and
display them in the catalogue page using JDBC.
ALGORITHM:
Class.forName("oracle.jdbc.driver.OracleDriver").newInstanc e() ;
60
DriverManager.getConnection("jdbc:oracle:thin:@SystemNa
me:PortNumber:DatabaseName","userId","Password");


ps.executeQuery();
OUT PUT:
61
INFERENCE:
local address.
APPLICATIONS:
EXTENSION:
VIVA QUESTIONs :
1)Which package contains Required classes and interfaces to connect to DB
2) Why DB connections are not written directly in JSPs? [ ]

(A) Response is slow (B) Not a standard J2EE architecture
62
(C) Load Balancing is not possible (D) Both B and C
3). Which JDBC driver Type(s) can be used in either applet or servlet code? [ ]
(A) Both Type 1 and Type 2 (B) Both Type 1 and Type 3
(C) Both Type 3 and Type 4 (D) Type 4 only
4) ____________ interface provides methods for handling exceptions thrown while evaluating a
body of an action elements. []
a) Try b) TryCatchFinally c) TryCatch d) Finally
5)what will be returned by the Executeupdate( ) method
EXPERIMENT NO: 12
Name of the Experiment: HTTP Session
AIM: Implementing Session Tracking.

THEORY:
HTTP is a stateless protocol. Session is required to maintain the state.
The user may add some items to cart from the catalog page. He can check the cart page
for the selected items. He may visit the catalogue again and select some more items. Here
our interest is the selected items should be added to the old cart rather than a new cart.
Multiple users can do the same thing at a time(i.e., from different systems in the LAN
using the ip-address instead of localhost). This can be achieved through the use of sessions.
Every user will have his own session, which will be created after his successful login to the
website. When the user logs out his session should get invalidated (by using the method
session.invalidate() ).
63
Modify your catalogue and cart JSP pages to achieve the above mentioned
functionality using sessions..
ALGORITHM:
1. Create a login Page.
2. Create a servlet page connected with HTML page which will create the
cookies.
3. Create a page that will check the session is valid or not.
4. Create a Page which will disconnect the session.
OUT PUT:
64
65
INFERENCE:
Internet web browser is available in your system and its enable to bypass the proxies
for local address.
APPLICATIONS:
Session tracking for multi user environment.
EXTENSION:
Now you can track the user’s sessions.

1. What is a HTTP session?
2. Write a syntax to add session?
3. What are the methods available in HttpSession interface?
4. What is meant by session tracking?
5. How to remove sessions ?
66

WT Lab Manual

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 Manual

Uploaded by

Copyright:

Available Formats

Web Technology

III YEAR B.TECH (II - SEM)

Department of Computer Science & Engineering

6. Students should be present in the labs for total scheduled duration.

10. Lab records need to be submitted on or before date of submission.

11. Use of computer network is encouraged.

SNO Experiment Name of the Experiment Page No

Objective , Hardware Software

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

The static home page must contain three frames.

Home Login Registration Catalogue Cart

ECE Description of the Web Site

This page looks like below:

Web Site Name

Home Login Registration Catalogue Cart

The details should contain the following:

Snap shot of Cover Page.

Web Site Name

Home Login Registration Catalogue Cart

CSE Book : XML

Book : Java 2 $ 35.5

Author : Sam Peter

The cart page should look like this:

Web Site Name

Home Login Registration Catalogue Cart

CSE Book name Price Quantity Amount

EEE Java 2 $35.5 2 $70

CIVIL XML bible $40.5 1 $40.5

Total amount - $130.5

Create a “registration form “with the following fields

1) Name (Text field)

3) E-mail id (text field)

4) Phone number (text field)

5) Sex (radio button)

7) Languages known (check boxes – English, Telugu, Hindi, Tamil)

8) Address (text area)

Password (Password should not be less than 6 characters length).

4. Phone number (Phone number should contain 10 digits only).

1) Use different font, styles:

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

4) Define styles for links as

5) Work with layers:

6) Add a customized cursor:

1) Title of the book

Display the XML file as follows.

Hint: You can use some xml editors like XML-spy

Create a simple visual bean with a area filled with a color.

Install TOMCAT web server and APACHE.

Access the pages by using the urls : http://localhost:4040/rama/books.html (for tomcat)

http://localhost:8080/books.html (for Apache)

Install a database(Mysql or Oracle).

Practice 'JDBC' connectivity.

Write a JSP which does the following job:

from the database ( similar to week8 instead of cookies).

HTTP is a stateless protocol. Session is required to maintain the state.

To create a fully functional website with mvc architecture. To Develop an online