61
VICKRAM COLLEGE OF ENGINEERING, ENATHI, SIVAGANGAI DISTRICT 630561. Affiliated to Anna University, Chennai LAB MANUAL 2012 2013 SUBJECT CODE : 10144IT607 SUBJECT NAME : WEB TECHNOLOGY LAB SEMESTER : VI BRANCH/YEAR : B.TECH(IT) PREPARED BY: APPROVED BY: Mr.M.Venkatesh Dr.A.Askarunisa ( Sr. Lecturer / CSE) (HOD / CSE)

Vce Web Tech Lab Manual It Batch

Embed Size (px)

DESCRIPTION

lab manual

Citation preview

Page 1: Vce Web Tech Lab Manual It Batch

VICKRAM

COLLEGE OF ENGINEERING, ENATHI, SIVAGANGAI

DISTRICT – 630561.

Affiliated to Anna University, Chennai

LAB MANUAL

2012 – 2013

SUBJECT CODE : 10144IT607

SUBJECT NAME : WEB TECHNOLOGY LAB

SEMESTER : VI

BRANCH/YEAR : B.TECH(IT)

PREPARED BY: APPROVED BY:

Mr.M.Venkatesh Dr.A.Askarunisa

( Sr. Lecturer / CSE) (HOD / CSE)

Page 2: Vce Web Tech Lab Manual It Batch

10144IT607 WEB TECHNOLOGY LABORATORY L T P C

0 0 3 2

1. Create a web page with the following using HTML :

i) To embed an image map in a web page

ii) To fix the hot spots

iii) Show all the related information when the hot spots are clicked.

2. Create a web page with all types of Cascading style sheets

3. Client Side Scripts for Validating Web Form Controls using DHTML.

4. Write programs in Java to create applets incorporating the following features: Create a

color palette with matrix of buttons Set background and foreground of the control text

area by selecting a color from color palette. In order to select Foreground or

background use check box control as radio buttons To set background images

5.Write programs in Java using Servlets:

i) To invoke servlets from HTML forms

ii) To invoke servlets from Applets

6. Write programs in Java to create three- tier applications using JSP and Databases for

conducting on-line examination, for displaying student mark list. Assume that student

information is available in a database which has been stored in a database server.

7. Programs using XML - Schema - XSLT/XSL

8. Program using DOM / SAX

9. Programs using AJAX

10.Consider A Case Where We Have Two Web Services An Airline Service And A

Travel Agent And The Travel Agent Is Searching For An Airline. Implement This

Scenario Using Web Services And Data Base.

TOTAL=45 PERIODS

Page 3: Vce Web Tech Lab Manual It Batch

INDEX

S.No Name of the Experiments Page No

1. Creation of web page using HTML to embed image and fix

hot spots

2. Creation of web page using all type of cascading style sheets

3. Client side scripts for validating web form controls using

DHTML

4. Creation of applets using java

5. 5.1 Invoke servlets from HTML forms

5.2 Invoke servlets from applets

6. Three-tier applications using jsp and database

7. Program using XML - Schema - XSLT/XSL

8. Program using DOM / SAX

9. Programs using AJAX

10. Web Services And Database.

Page 4: Vce Web Tech Lab Manual It Batch

EX.NO:1 CREATION OF WEBPAGE USING HTML

AIM:

To create a web page with embed an image map and to with hot spots and related

information when hotspots are c licked.

ALGORITHM:

Step 1: Create a html page.

Step 2: Using image tag embed an any image map in the created html page.

Step 3: Create hotspots in embedded image using different styles(rect,wide…).

Step 4: To get detailed information when hotspots clicked ,using href tag create

some html pages for hot spot

Step 5: Display the results

Step 6: Stop

Page 5: Vce Web Tech Lab Manual It Batch

PROGRAM CODING:

(EXP1.HTML)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

"http://www.w3.org/TR/html4/loose.dtd">

<head>

<title>Tamilnadu map</title>

</head>

<body bgcolor="white" text="Black">

<p>

<i>

<font size="45">

Tamilnadu state map

</font>

</i>

</p>

<map name="tamilnadu" align="middle">

<area href="kovai.html" shape="rect" coords="320,334,190,282">

<area href="Thrichy.html" shape="rect" coords="520,150,160,382">

<area href="madurai.html" shape="rect" coords="680,488,190,280">

<area href="http://en.wikipedia.org/wiki/Chennai" shape="rect" coords="700,40,190,100">

</map>

<img src="TN.02.jpg"

usemap="#tamilnadu" align="middle">

</body>

</html>

(KOVAI.HTML)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

"http://www.w3.org/TR/html4/loose.dtd">

<head>

<title>kovai district map</title>

</head>

<body text="black">

<img src="coimbatore.jpg">

<p>

Page 6: Vce Web Tech Lab Manual It Batch

<font size="3.9">

Coimbatore, also known as Kovai,it is the second largest city in the Indian state of </p>

<p>Tamil Nadu and the 15th largest urban agglomeration in India with a metropolitan

population of</p><p> over 2 million.It is the second largest urban agglomeration in the

state.</p></font></p>

</body>

</html>

(MADURAI.HTML)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

"http://www.w3.org/TR/html4/loose.dtd">

<head>

<title>Madurai</title>

</head>

<body text="black">

<img src="madurai_map.jpg" align="middle">

<font size="4">

<p>Madurai is the administrative headquarters of Madurai<p> District

in the South Indian state of Tamil Nadu.</p> It is the third largest city

in Tamilnadu next to Chennai and Coimbatore and the <p>second largest

municipal corporation in Tamil Nadu next only to Chennai.It is the

most important city in Tamil Nadu state after Chennai and Coimbatore

respectively.</p> It is the capital of Tamil Nadu by administration

headquarters of southern districts in Tamil Nadu.<p>Located on the

banks of River Vaigai, it has been a major settlement for over two millennia.

</p>

</font>

</body>

</html>

(TRICHY.HTML)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

"http://www.w3.org/TR/html4/loose.dtd">

<head>

<title>Trichy</title>

Page 7: Vce Web Tech Lab Manual It Batch

</head>

<body text="black">

<img src="trichy mpa.jpg">

<font size="4">

<p>Tiruchirappalli also called Tiruchi or Trichy, is a city in the</p> <p> Indian state of

Tamil Nadu and the administrative headquarters of Tiruchirappalli District.</p> <p>

It is the Fourth largest municipal corporation in Tamil Nadu and also the Fourth largest

urban agglomeration in the state.

</p>

</font>

</body>

</html>

Page 8: Vce Web Tech Lab Manual It Batch

OUTPUT:

TRICHY.HTML

Page 9: Vce Web Tech Lab Manual It Batch

RESULT:

Thus web page with embed an image map and with hot spots and related information

are successfully created.

Page 10: Vce Web Tech Lab Manual It Batch

Ex.no:2 CREATION OF WEB PAGE USING ALL TYPE OF CASCADING

STYLE SHEETS.

AIM:

To create a web page by using external as well as internal style sheets.

ALGORITHM :

Step 1: Create a HTML page with necessary DOC TYPE.

Step 2: Give the title in the head tag.

Step 3: Create a internal style sheet in the head using style tag,

Step 4: Call the external style sheet file XYZ.CSS using link real attribute.

Step 5: In the body tag ,using the style sheet class give the contents.

Step 6: In h3 tag create a table using external style sheet.

Step 7: Display the output.

Step 8: Close.

Page 11: Vce Web Tech Lab Manual It Batch

PROGRAM CODING:

(XYZ.CSS)

h3{font_family:arial;font_size:20;color:cyan}

table{border_color:green}

td{font_size;20pt;color:magenta}

(EXP2.HTML)

<html>

<head><h1><center> ALL STYLE SHEETS</center></h1>

<title>USE OF INTERNAL AND EXTERNAL STYLE SHEETS

</title>

<link rel="style sheet" href="xyz.css"type="text/css">

<style type="text/css">

.vid{font_family:verdana;font_style:italic,color:red;text_align:center}

.ani{font_family:tahoma;font_style:italic;font_size:20;text_align:center;}

font{font_family:georgia;color:blue;font_size:20}

ul{list_style_type:circle}

</style>

</head>

<body>

</ol>

<p style="font_size;20pt;color:purple"> Vickram College of Engineering </p>

<p class="ani"> Vickram college of engineering is owned by M.K.S.Srinivasan <br> It is

approved by AICTE. Affilaiated to anna university chennai <br></p>

<h2 class="vid"> Vickram College of Engineering </h2>

<br>

<font> It is an ISO certified institution </font><br>

<br>

<font>

<h2> List of subjects</h2>

<ul>

<li> Numerical method </li>

<li> Web Technology </li>

<li> Network proramming management </li>

<li> Cryptography and network security </li>

<li> Embedded System </li>

<li> Object Oriented Analysis And Design </li>

Page 12: Vce Web Tech Lab Manual It Batch

</ul>

</font>

<h3> Internal mark list </h3>

<table width="100%"cellspacing="2"cellpadding="2"border="5">

<tr>

<th> S.Name </th>

<th> Marks </th>

<th> Results </th>

</tr>

<tr>

<td align="center"> Abi </td>

<td align="center"> 100 </td>

<td align="center"> pass </td>

</tr>

<tr>

<td align="center"> aseefa </td>

<td align="center"> 100 </td>

<td align="center"> pass </td>

</tr>

<tr>

<td align="center"> Anusha </td>

<td align="center"> 100 </td>

<td align="center"> pass </td>

</tr>

</table>

</body>

</html>

Page 13: Vce Web Tech Lab Manual It Batch

OUTPUT:

RESULT:

Thus we created a web page by using as well as internal style sheets and successfully

executed.

Page 14: Vce Web Tech Lab Manual It Batch

Ex.no:3. CLIENT SIDE SCRIPTS FOR VALIDATING WEB FORMS

CONTROLS USING DHTML.

AIM:

Create a client side script for validatinig web form controls usiing HTML.

ALGORITHM:

Step 1: Create a html page using script tag.

Step 2: Define the function validate and define all the validation opearation.

Step 3: Produce the alert message on incomplete submission and also for complete

Submission.

Step 4: In the body attribute tag define background font colors and font style.

Step 5: Create the input type label as a name,depart and id number.

Step 6: Fix the range of the id number as input using max length.

Step 7: On clciking the submit button the validating form function will invoke.

Step 8: Execute the html code in internet explorer on any of the browser.

Page 15: Vce Web Tech Lab Manual It Batch

PROGRAM CODING:

<html>

<head>

<title>validation checking </title>

</head>

<script language="javascript"> function passwordStrength(password)

{

var str1="strong"; var str2="weak";

if (password.length > 6)

document.getElementById("passwordDescription").innerHTML =str1; else

document.getElementById("passwordDescription").innerHTML =str2;

}

function a()

{

var i=document.form1.uname.value; var a=i.length;

var j=document.form1.pass.value; var b=j.length;

if(a==0&&b==0)

window.alert("Enter username and password"); else

{

if(a==0)

window.alert("Enter username "); if(b==0)

window.alert("Enter password");

}

if(a!=0&&b!==0&&b<7) window.alert("password is too short");

}

</script> <body>

<form name="form1" >

<font color="red"><marquee>WEBSITE MODERATORS : </marquee></font>

<br> <br>

UserName:<input type="text" name="uname">@india.com <br>

Password:&nbsp;&nbsp;<input type="password" name="pass"

onkeyup="passwordStrength(this.value)">

<label >Password strength:</label><label id="passwordDescription" >password not

entered</label> <p><h6>Minimum of 7 characters in length.</h6></p> <br>

Powered By www.technoscriptz.com

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&n

bsp;&nbsp;&nbsp;

<input type="button" value="Submit" onclick="a()">

</form>

</body>

Page 16: Vce Web Tech Lab Manual It Batch

OUTPUT:

RESULT:

Thus we created a client side script for validating web form controls using DHTML.

Page 17: Vce Web Tech Lab Manual It Batch

EX.NO:4 APPLETS USING JAVA

AIM:

To write programs in java to create applets incorporating the following features.

i) Create a color palette with matrix of buttons.

ii) Set background and foreground of the control text area by selecting a color from color

palette.

iii) In order to select foreground and background use checkbox control as radio button.

iv) To set background images.

ALGORITHM:

Step 1: Include all necessary header files.

Step 2: Initialize the applet code with height as 800 and width as 300.

Step 3: Extend applet/code with height as 800 and width as 300 which implements

ItemListener

Step 4: Initialize the six buttons with red , blue , green , yellow , magenta and white.

Step 5: The default color of background is white.

Step 6: The default color of text is set as black.

Step 7: Image can be imported.

Step 8: Run the program.

Page 18: Vce Web Tech Lab Manual It Batch

PROGRAM CODING:

import java.awt.*;

import java.awt.event.*;

import java.applet.*;

/*<applet code="exp" width=400 height=400>

</applet>*/

public class exp extends Applet implements ItemListener

{

int currcolor=5;

int flag=1;

String text="Click any of the buttons";

Button buttons[]=new Button[5];

String colours[]={"Red","Blue","Green","Yellow","Magenta"};

Image img;

CheckboxGroup cbg=new CheckboxGroup();

Checkbox box1=new Checkbox("Background Color",cbg,true);

Checkbox box2=new Checkbox("Text Color",cbg,false);

Checkbox box3=new Checkbox("Loading Image",cbg,false);

public void init()

{

for(int i=0;i<5;i++)

{

buttons[i]=new Button(" ");

add(buttons[i]);

}

buttons[0].setBackground(Color.red);

buttons[1].setBackground(Color.blue);

buttons[2].setBackground(Color.green);

buttons[3].setBackground(Color.yellow);

buttons[4].setBackground(Color.magenta);

Page 19: Vce Web Tech Lab Manual It Batch

add(box1);

add(box2);

add(box3);

box1.addItemListener(this);

box2.addItemListener(this);

box3.addItemListener(this);

}

public void itemStateChanged(ItemEvent ev)

{

if(box1.getState()==true)

flag=1;

else if(box2.getState()==true)

{

text="Default color is black";

flag=2;

}

else if(box3.getState()==true)

{

img=getImage(getDocumentBase(),"Blue hills.jpg");

flag=3;

}

repaint();

}

public void paint(Graphics g)

{

if(flag==2)

{

g.drawString(text,30,100);

switch(currcolor)

Page 20: Vce Web Tech Lab Manual It Batch

{

case 0:

g.setColor(Color.red);

break;

case 1:

g.setColor(Color.blue);

break;

case 2:

g.setColor(Color.green);

break;

case 3:

g.setColor(Color.yellow);

break;

case 4:

g.setColor(Color.magenta);

break;

case 5:

g.setColor(Color.black);

break;

}

g.drawString(text,30,100);

}

else if(flag==1)

{

g.drawString(text,30,100);

switch(currcolor)

{

case 0:

setBackground(Color.red);

Page 21: Vce Web Tech Lab Manual It Batch

break;

case 1:

setBackground(Color.blue);

break;

case 2:

setBackground(Color.green);

break;

case 3:

setBackground(Color.yellow);

break;

case 4:

setBackground(Color.magenta);

break;

case 5:

setBackground(Color.white);

break;

}

}

else if(flag==3)

{

g.drawImage(img,20,90,this);

}

}

public boolean action(Event e,Object o)

{

for(int i=0;i<5;i++)

{

if(e.target==buttons[i])

{

Page 22: Vce Web Tech Lab Manual It Batch

currcolor=i;

text="You have chosen "+colours[i];

repaint();

return true;

}

}

return false;

}

}

Page 23: Vce Web Tech Lab Manual It Batch

OUTPUT:

Page 24: Vce Web Tech Lab Manual It Batch

RESULT:

Thus the java program for color palette, with background, foreground and to set

background images is creates and executed successfully.

Page 25: Vce Web Tech Lab Manual It Batch

5.i) INVOKE SERVLETS FROM HTML FORMS

AIM:

To write a java program to invoke servlets from HTML form.

ALGORITHM:

client.html

Step 1: Create a web page using HTML form that contains the fields such as text, password

and one submit button.

Step 2: Set the URL of the server as the value of form’s action attribute.

Step 3: Run the HTML program.

Step 4: Submit the form data to the server.

server.java

Step 1: Define the class server that extends the property of the class GenericServlet.

Step 2: Handle the request from the client by using the method service() of GenericServlet

class.

Step 3: Get the parameter names from the HTML form by using the method

getParameterNames().

Step 4: Get the parameter values from the HTML forms by using the method getParameter().

Step 5: Send the response to the client by using the method of PrintWriter class.

Page 26: Vce Web Tech Lab Manual It Batch

PROGRAM CODING:

Servlethtml.HTML

<html>

<head>

<title>Invoking Servlet From HTML</title>

</head>

<body bgcolor="violet">

<form name="form1" method="post" action="http://localhost:8080/servlet/server">

<fieldset>

<legend>Registration</legend>

Enter E-mail&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:

<input type="text" name="LoginID" size="25"/><br/><br/>

Enter Password:

<input type="password" name="Password" size="25">

<input type="submit" Value="SUBMIT">

</fieldset>

</form>

</body>

</html>

Server.java

import java.io.*;

import java.util.*;

import javax.servlet.*;

public class server extends GenericServlet

{

public void service(ServletRequest req,ServletResponse res)throws

ServletException,IOException

{

PrintWriter pw=res.getWriter();

pw.print("<h3>Registration Successful...</h3>");

Enumeration e=req.getParameterNames();

while(e.hasMoreElements())

{

Page 27: Vce Web Tech Lab Manual It Batch

String str1=(String)e.nextElement();

String str2=req.getParameter(str1);

pw.print(str1+"="+str2+"<br/>");

}

pw.close();

}

}

Web.xml

servlet>

<servlet-name>server</servlet-name>

<servlet-class>server</servlet-class>

</servlet>

<servlet-mapping>

<servlet-name>server</servlet-name>

<url-pattern>/servlet/server</url-pattern>

</servlet-mapping>

Page 28: Vce Web Tech Lab Manual It Batch

OUTPUT:

Result:

Thus the program for invoking servlets from html file was successfully executed..

Page 29: Vce Web Tech Lab Manual It Batch

5.ii) INVOKE SERVLETS FROM APPLETS

AIM:

To write a java program that invokes servlet from applet.

ALGORITHM:

Step 1: Create the java program with the following

a) Define the class Myapplet which extends the property of the class Applet and

implements the interface ActionListener.

b) Define the objects for Button and add the button in the init() method of Applet class

c) Make the button to listen the action by using the method addActionListener().

d) Set the URL of the servlet program by using the object of the class URL.

e) Define the object for AppletContext in order to display the output of the servlet on

new browser window.

Step 2: Create HTML file that contains the applet tag and pass the class name to that applet

code.

Step 3: Create the simple servlet program that contains any response message

Step 4: Run the HTML file that contains the corresponding applet code.

Step 5: Click the button on the applet window in order to invoke the servlet program.

Page 30: Vce Web Tech Lab Manual It Batch

PROGRAM CODING:

Applet.html

<html>

<head>

<title>Invoking Servlets From Applet</title>

</head>

<body bgcolor="violet">

<applet code="AppletClient.class" width="400" height="200">

</applet>

</body>

</html>

AppletClient.java

import java.applet.*;

import java.awt.*;

import java.awt.event.*;

import java.net.*;

public class AppletClient extends Applet implements ActionListener

{

public void init()

{

Label la=new Label("INVOKING SERVLET FROM APPLET");

la.setFont(new Font("Courier",Font.BOLD,15));

la.setForeground(Color.white);

add(la);

Button b1=new Button("Click Here To Display Date Information From Server");

b1.setBackground(Color.black);

b1.setForeground(Color.white);

add(b1);

b1.addActionListener(this);

Page 31: Vce Web Tech Lab Manual It Batch

}

public void actionPerformed(ActionEvent ae)

{

try

{

AppletContext ac=getAppletContext();

URL url = new URL("http://localhost:8080/servlet/MyServer");

ac.showDocument(url);

}

catch(Exception e)

{

System.out.println(e);

}

}

}

MyServer.java

import java.io.*;

import java.util.*;

import javax.servlet.*;

public class MyServer extends GenericServlet

{

public void service(ServletRequest req,ServletResponse res)throws

ServletException,IOException

{

PrintWriter pw=res.getWriter();

Date d=new Date();

pw.println("<html><body bgcolor=blue><h2>Server Response</h2>");

pw.println("<h3>Current Date and Time From Server:</h3>");

pw.println("<b>"+d+"</b></body></html>");

Page 32: Vce Web Tech Lab Manual It Batch

}

}

Web.xml

<servlet>

<servlet-name>AppletClient</servlet-name>

<servlet-class>MyServer</servlet-class>

</servlet>

<servlet-mapping>

<servlet-name>AppletClient</servlet-name>

<url-pattern>/servlet/MyServer</url-pattern>

</servlet-mapping>

Page 33: Vce Web Tech Lab Manual It Batch

OUTPUT:

RESULT:

Thus the program for invoking servlets from applet was successfully executed..

Page 34: Vce Web Tech Lab Manual It Batch

Ex.no:6 THREE TIER APPLICATIONS USING JSP AND DATABASE

AIM:

Write a program in Java to create a three tier application using servlet

For conducting on-line examination

For displaying the student mark list. Assume student information is available in a

database which

has been stored in a database server.

ALGORITHM:

STEP 1: Start the program.

STEP 2: Write a servlet program using JSP

STEP 3: Create a Database in MS-ACCESS and name it as studentDB1.mdb

STEP 4: Save the JSP program with extension of jsp.

STEP 5: Open the saved file using web browser.

STEP 6: Stop the program.

Page 35: Vce Web Tech Lab Manual It Batch

CODINGS:

<%@ page language="java" import="java.sql.*" %>

<%@ page import="java.io.*" %>

<%@ page import="java.util.*" %>

<%

String SeatNum,Name;

String ans1,ans2,ans3,ans4,ans5;

int a1,a2,a3,a4,a5;

a1=a2=a3=a4=a5=0;

Connection connect=null;

Statement stmt=null;

ResultSet rs=null;

Class.forName("sun.jdbc.odbc.JdbcOdbcDriver");

String url = "jdbc:odbc:StudentDB1";

connect = DriverManager.getConnection(url, " ", " ");

if(request.getParameter("action")!=null)

{

SeatNum = request.getParameter("Seat_no");

Name = request.getParameter("Name");

ans1 =request.getParameter("group1");

if(ans1.equals("True"))

a1=2;

else

a1=0;

ans2 = request.getParameter("group2");

if(ans2.equals("True"))

a2=0;

else

a2=2;

ans3 = request.getParameter("group3");

if(ans3.equals("True"))

a3=0;

else

a3=2;

ans4 = request.getParameter("group4");

if(ans4.equals("True"))

a4=2;

else

a4=0;

ans5 = request.getParameter("group5");

if(ans5.equals("True"))

a5=0;

else

a5=2;

int Total=a1+a2+a3+a4+a5;

stmt = connect.createStatement();

Page 36: Vce Web Tech Lab Manual It Batch

String query = "INSERT INTO StudentTable (" + "Seat_no,Name,Marks" + ")

VALUES ('" +SeatNum + "', '" + Name + "', '"+Total+ "')";

int result = stmt.executeUpdate(query);

stmt.close();

stmt = connect.createStatement();

query = "SELECT * FROM StudentTable WHERE Name="+"'"+Name+"'";

rs = stmt.executeQuery(query);

%>

<html><head><title>Student Mark List</title></head>

<body bgcolor=khaki>

<center>

<h2>Students Marksheet</h2>

<h3>Name of the College:ABC College of Engineering</h3>

<table border="1" cellspacing="0" cellpadding="0">

<tr>

<td><b>Seat_No</b></td>

<td><b>Name</b></td>

<td><b>Marks</b></td>

</tr>

<%

while(rs.next())

{

%>

<tr>

<td><%=rs.getInt(1)%></td>

<td> <%=rs.getString(2)%></td>

<td> <%=rs.getString(3)%></td>

</tr>

<%

}

rs.close();

stmt.close();

connect.close();

%>

</table>

</center>

<br/> <br/><br/>

<table>

<tr><td><b>Date:<%=new java.util.Date().toString() %></td></tr>

<tr><td><b>Signature: X.Y.Z. <b></td></tr>

</table>

<div>

<a href="http://localhost:8080/examples/jsp/webtech/Exam.jsp">Click here to go back</a>

</body>

</html>

<%}else{%>

<html>

Page 37: Vce Web Tech Lab Manual It Batch

<head><title>Online Examination</title>

<script language="javascript">

function validation(Form_obj)

{

if(Form_obj.Seat_no.value.length==0)

{

alert("Please,fill up the Seat Number");

Form_obj.Seat_no.focus();

return false;

}

if(Form_obj.Name.value.length==0)

{

alert("Please,fill up the Name");

Form_obj.Name.focus();

return false;

}

return true;

}

</script>

</head>

<body bgcolor=lightgreen>

<center>

<h1>OnLine Examination</h1>

</center>

<form action="Exam.jsp" method="post"

name="entry" onSubmit="return validation(this)">

<input type="hidden" value="list" name="action">

<table>

<tr>

<td><h3>Seat Number:</h3></td>

<td><input type="text" name="Seat_no"></td>

</tr>

<tr>

<td><h3>Name:</h3></td>

<td><input type="text" name="Name" size="50"></td>

</tr>

<hr/>

<tr>

<td><b>Total Marks:10(Each question carries equal marks) </b></td>

<td></td><td></td><td></td><td><b>Time: 15 Min.</b></td>

</tr>

</table>

<hr/>

<b>1. Apache is an open source web server</b><br/>

<input type="radio" name="group1" value="True">True

<input type="radio" name="group1" value="False">False<br>

<br/>

Page 38: Vce Web Tech Lab Manual It Batch

<b>2. In Modern PC there is no cache memory.</b><br/>

<input type="radio" name="group2" value="True">True

<input type="radio" name="group2" value="False">False<br>

<br/>

<b>3. Tim-Berner Lee is the originator of Java.</b><br/>

<input type="radio" name="group3" value="True">True

<input type="radio" name="group3" value="False">False<br>

<br/>

<b>4.JPG is not a video file extension.</b><br/>

<input type="radio" name="group4" value="True">True

<input type="radio" name="group4" value="False">False<br>

<br/>

<b>5. HTTP is a statefull protocol</b><br/>

<input type="radio" name="group5" value="True">True

<input type="radio" name="group5" value="False">False<br>

<hr/>

<center>

<input type = "submit" value="Submit">

<input type = "reset" value="Clear"><br><br>

</center>

</form>

<%}%>

Page 39: Vce Web Tech Lab Manual It Batch

OUTPUT:

Page 40: Vce Web Tech Lab Manual It Batch

RESULT:

Thus the program using jsp and database for online examination has been executed

successfully.

Page 41: Vce Web Tech Lab Manual It Batch

Ex.no:7 PROGRAM USING XML - SCHEMA – XSLT/XSL

AIM:

To write a XSL program for converting the given XML document into equivalent

XHTML.

ALGORITHM:

STEP 1: Start the program.

STEP 2: Write a sample XML program.

STEP 3: write a XSL program that contains the XSL elements for converting into

XHTML file

STEP 4: Insert the following tag in the second line of the XML file

<?xml-stylesheet type="text/xsl" href="7thexp.xsl"?>

STEP 5: Open the saved XML file using web browser.

STEP 6: Stop the program.

Page 42: Vce Web Tech Lab Manual It Batch

CODING:

7thexp.xml

<?xml version="1.0" encoding="ISO-8859-1"?>

<!-- Edited by XMLSpy® -->

<?xml-stylesheet type="text/xsl" href="7thexp.xsl"?>

<breakfast_menu>

<food>

<name>CHAPPATHI </name>

<price>$5.95</price>

<description>two of our famous Belgian Waffles with plenty of real maple

syrup</description>

<calories>650</calories>

</food>

<food>

<name>DOSA </name>

<price>$7.95</price>

<description>light Belgian waffles covered with strawberries and whipped

cream</description>

<calories>900</calories> </food>

<food>

<name>IDLY </name>

<price>$8.95</price>

<description>light Belgian waffles covered with an assortment of fresh berries and whipped

cream</description>

<calories>900</calories>

</food> <food>

<name>IDYAPPAM </name>

<price>$4.50</price>

Page 43: Vce Web Tech Lab Manual It Batch

<description>thick slices made from our homemade sourdough bread</description>

<calories>600</calories>

</food>

<food>

<name>PONGAL </name>

<price>$6.95</price>

<description>two eggs, bacon or sausage, toast, and our ever-popular hash

browns</description>

<calories>950</calories>

</food>

</breakfast_menu>

7thexp.xsl

<?xml version="1.0" encoding="ISO-8859-1"?>

<!-- Edited by XMLSpy® -->

<html xsl:version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"

xmlns="http://www.w3.org/1999/xhtml">

<body style="font-family:Arial;font-size:12pt;background-color:#EEEEEE">

<xsl:for-each select="breakfast_menu/food">

<div style="background-color:teal;color:white;padding:4px">

<span style="font-weight:bold"><xsl:value-of select="name"/></span>

<xsl:value-of select="price"/>

</div>

<div style="margin-left:20px;margin-bottom:1em;font-size:10pt">

<xsl:value-of select="description"/>

<span style="font-style:italic">

<xsl:value-of select="calories"/> (calories per serving)

</span>

</div>

</xsl:for-each>

</body>

</html>

Page 44: Vce Web Tech Lab Manual It Batch

OUTPUT:

RESULT:

Thus the XSL program for converting the given XML document into equivalent

XHTML has been executed successfully.

Page 45: Vce Web Tech Lab Manual It Batch

Ex.no:8 PROGRAM USING DOM / SAX

AIM

To develop a program for parsing the given XML file using DOM and SAX parsers.

ALGORITHM

STEP 1: Start the program.

STEP 2: Write a sample XML program.

STEP 3: Write a DOM Parser program using java by including the necessary

package.

STEP 4: Execute the java program by including the XML file as an argument.

STEP 5: Write a SAX Parser program using java by including the necessary

package.

STEP 6: Execute the java program by including the XML file as an argument.

STEP 7:Stop the program.

PROGRAM

colorfile.xml

<?xml version="1.0"?>

<!DOCTYPE shapes [

<!ELEMENT shapes (circle)*>

<!ELEMENT circle (x,y,radius)>

<!ELEMENT x (#PCDATA)>

<!ELEMENT y (#PCDATA)>

<!ELEMENT radius (#PCDATA)>

<!ATTLIST circle color CDATA #IMPLIED>

]>

<shapes>

<circle color="BLUE">

<x>20</x>

<y>20</y>

<radius>20</radius>

</circle>

<circle color="RED" >

<x>40</x>

<y>40</y>

<radius>20</radius>

</circle>

Page 46: Vce Web Tech Lab Manual It Batch

</shapes>

//program using DOM parser.

import java.io.*;

import org.w3c.dom.*;

import org.apache.xerces.parsers.DOMParser;

public class shapes_DOM {

static int numberOfCircles = 0; // total number of circles seen

static int x[] = new int[1000]; // X-coordinates of the centers

static int y[] = new int[1000]; // Y-coordinates of the centers

static int r[] = new int[1000]; // radius of the circle

static String color[] = new String[1000]; // colors of the circles

public static void main(String[] args) {

try{

// create a DOMParser

DOMParser parser=new DOMParser();

parser.parse(args[0]);

// get the DOM Document object

Document doc=parser.getDocument();

// get all the circle nodes

NodeList nodelist = doc.getElementsByTagName("circle");

numberOfCircles = nodelist.getLength();

// retrieve all info about the circles

for(int i=0; i<nodelist.getLength(); i++) {

// get one circle node

Node node = nodelist.item(i);

// get the color attribute

NamedNodeMap attrs = node.getAttributes();

if(attrs.getLength() > 0)

color[i]=(String)attrs.getNamedItem("color").getNodeValue();

// get the child nodes of a circle node

NodeList childnodelist = node.getChildNodes();

Page 47: Vce Web Tech Lab Manual It Batch

// get the x and y value

for(int j=0; j<childnodelist.getLength(); j++) {

Node childnode = childnodelist.item(j);

Node textnode = childnode.getFirstChild();//the only text node

String childnodename=childnode.getNodeName();

if(childnodename.equals("x"))

x[i]= Integer.parseInt(textnode.getNodeValue().trim());

else if(childnodename.equals("y"))

y[i]= Integer.parseInt(textnode.getNodeValue().trim());

else if(childnodename.equals("radius"))

r[i]= Integer.parseInt(textnode.getNodeValue().trim());

}

}

// print the result

System.out.println("circles="+numberOfCircles);

for(int i=0;i<numberOfCircles;i++) {

String line="";

line=line+"(x="+x[i]+",y="+y[i]+",r="+r[i]+",color="+color[i]+")";

System.out.println(line);

}

} catch (Exception e) {e.printStackTrace(System.err);}

}

}

//program using SAX parser.

import java.io.*;

import org.xml.sax.*;

import org.xml.sax.helpers.DefaultHandler;

import org.apache.xerces.parsers.SAXParser;

public class shapes_SAX extends DefaultHandler {

static int numberOfCircles = 0; // total number of circles seen

static int x[] = new int[1000]; // X-coordinates of the centers

static int y[] = new int[1000]; // Y-coordinates of the centers

static int r[] = new int[1000]; // radius of the circle

static String color[] = new String[1000]; // colors of the circles

Page 48: Vce Web Tech Lab Manual It Batch

static int flagX=0; //to remember what element has occurred

static int flagY=0; //to remember what element has occurred

static int flagR=0; //to remember what element has occurred

// main method

public static void main(String[] args) {

try{

shapes_SAX SAXHandler = new shapes_SAX (); // an instance of this class

SAXParser parser=new SAXParser(); // create a SAXParser object

parser.setContentHandler(SAXHandler); // register with the ContentHandler

parser.parse(args[0]);

} catch (Exception e) {e.printStackTrace(System.err);} // catch exeptions

}

// override the startElement() method

public void startElement(String uri, String localName,

String rawName, Attributes attributes) {

if(rawName.equals("circle")) // if a circle element is seen

color[numberOfCircles]=attributes.getValue("color"); // get the color attribute

else if(rawName.equals("x")) // if a x element is seen set the flag as 1

flagX=1;

else if(rawName.equals("y")) // if a y element is seen set the flag as 2

flagY=1;

else if(rawName.equals("radius")) // if a radius element is seen set the flag as 3

flagR=1;

}

// override the endElement() method

public void endElement(String uri, String localName, String rawName) {

// in this example we do not need to do anything else here

if(rawName.equals("circle")) // if a circle element is ended

numberOfCircles += 1; // increment the counter

}

// override the characters() method

public void characters(char characters[], int start, int length) {

String characterData =

(new String(characters,start,length)).trim(); // get the text

if(flagX==1) { // indicate this text is for <x> element

Page 49: Vce Web Tech Lab Manual It Batch

x[numberOfCircles] = Integer.parseInt(characterData);

flagX=0;

}

else if(flagY==1) { // indicate this text is for <y> element

y[numberOfCircles] = Integer.parseInt(characterData);

flagY=0;

}

else if(flagR==1) { // indicate this text is for <radius> element

r[numberOfCircles] = Integer.parseInt(characterData);

flagR=0;

}

}

// override the endDocument() method

public void endDocument() {

// when the end of document is seen, just print the circle info

System.out.println("circles="+numberOfCircles);

for(int i=0;i<numberOfCircles;i++) {

String line="";

line=line+"(x="+x[i]+",y="+y[i]+",r="+r[i]+",color="+color[i]+")";

System.out.println(line);

}

}

}

Page 50: Vce Web Tech Lab Manual It Batch

OUTPUT:

RESULT:

Thus the program for parsing the given XML file using DOM and SAX parsers has been

executes successfully.

Page 51: Vce Web Tech Lab Manual It Batch

EX.NO:9 PROGRAM USING AJAX

AIM:

To Write a Programs using Asynchronous Java Script and XML.

ALGORITHM:

STEP 1: Start the program.

STEP 2: Write a program using html that includes the necessary tags and java

script function and object (XMLHttpRequest)

STEP 3: Update the web page using the content given in an input file.

STEP 4: Stop the program.

CODING:

Ajax.html

//source file

<html>

<head>

<script type="text/javascript">

function loadXMLDoc()

{

if (window.XMLHttpRequest)

{// code for IE7+, Firefox, Chrome, Opera, Safari

xmlhttp=new XMLHttpRequest();

}

else

{// code for IE6, IE5

xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");

}

xmlhttp.onreadystatechange=function()

{

if (xmlhttp.readyState==4 && xmlhttp.status==200)

Page 52: Vce Web Tech Lab Manual It Batch

{

document.getElementById("myDiv").innerHTML=xmlhttp.responseText;

}

}

xmlhttp.open("GET","ajax_info.txt",true);

xmlhttp.send();

}

</script>

</head>

<body>

<div id="myDiv"><h2>Let AJAX change this text</h2></div>

<button type="button" onclick="loadXMLDoc()">Change Content</button>

</body>

</html>

//input file ajax_info.txt

AJAX is not a new programming language.

AJAX is a technique for creating fast and dynamic web pages.

Page 53: Vce Web Tech Lab Manual It Batch

OUTPUT:

RESULT:

Thus the program using Asynchronous Javascript and XML (AJAX) has been executed

successfully.

Page 54: Vce Web Tech Lab Manual It Batch

Ex.no:10. WEB SERVICE AND DATABASE

AIM:

To create an airline service and a travel agent and the travel agent is searching for an

airline using web services and database

ALOGRITHM:

Step 1: Create webpage in jsp with airline service information for travel agencies.

Step 2: Create database for airline in MSAcess.

Step 3: Connect the database with servlet.

Step 4: Open jsp file using any servlet and also open database file

Step 5: Enter the details and update it.

Step 6: Stop the program.

Page 55: Vce Web Tech Lab Manual It Batch

Coding

index.jsp

<%@page contentType="text/html" pageEncoding="UTF-8"%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

"http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>Travel Agency</title>

</head>

<body>

<center><h1>Travel Easy</h1>

<h3> - A Smarter way to travel</h3>

<br><br>

<b> Enter your Details</b>

<form name="index" action="AirlineList.jsp" method="post">

<br>

<table cellpadding="6" cellspacing="6">

<tr>

<td><b>From</b></td>

<td><input type="text" name="txt_from"</td>

</tr>

<tr>

<td><b>To</b></td>

<td><input type="text" name="txt_to"</td>

</tr>

<tr>

<td><b>Date of Journey</b></td>

<td><input type="text" name="txt_depart"</td>

</tr>

<tr>

<td><b>Number of Passengers</b></td>

<td><input type="text" name="txt_no"</td>

</tr>

<tr>

<td><b>Type of Flight</b></td>

<td><input type="Radio" name="group1" value="domestic">Domestic

Flights</td

</tr>

<tr>

Page 56: Vce Web Tech Lab Manual It Batch

<td></td>

<td><input type="Radio" name="group1" value="international">International

Flights</td>

</tr>

<tr>

<td><b>Select desired Airlines</b></td>

<td>

<select name="airline">

<option>Kingfisher</option>

<option>SpiceJet</option>

</select>

</td>

</tr>

</table>

<br><br>

<input type="Submit" name="Submit" value="Find Flights">

</form>

</center>

</body>

</html>

AirlineList.jsp

<%@page contentType="text/html" pageEncoding="UTF-8"%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

"http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>Domestic Flights</title>

</head>

<body>

<center><h1>Travel Easy</h1>

<h3> - A Smarter way to travel</h3>

</center>

<br><br>

<%@ page language="java" %>

<%@ page import ="java.sql.*" %>

<%@ page import =

Page 57: Vce Web Tech Lab Manual It Batch

"java.util.Date,java.text.SimpleDateFormat,java.text.ParseException"%>

<%

String type = request.getParameter("group1");

String from= request.getParameter("txt_from");

String to = request.getParameter("txt_to");

String depart= request.getParameter("txt_depart");

String ret = request.getParameter("txt_return");

String no = request.getParameter("txt_no");

String airline = request.getParameter("airline");

Class.forName("sun.jdbc.odbc.JdbcOdbcDriver");

String sTable = type;

String sSql = "SELECT * FROM " sTable " WHERE From='" from "' and TO='" to

"' and DepartDate='" depart "' and SeatCapacity>=" no "";

String sDBQ = "d:/" airline ".mdb";

String database = "jdbc:odbc:Driver={Microsoft Access Driver (*.mdb)};DBQ="

sDBQ ";DriverID=22;READONLY=true";

Connection cn = null;

Statement st = null;

ResultSet rs = null;

try {

cn = DriverManager.getConnection( database ,"","");

st = cn.createStatement();

rs = st.executeQuery( sSql );

ResultSetMetaData rsmd = rs.getMetaData();

String s1,s2,s3,s4,s5,s6,s7,s8;

int i=1;

String flight_no[] = new String[100];

//out.println("<form name='AirlLine' action='' method='post'><b>" i " . "

rs.getString(1) "</b><br><br>");

out.println("<h3><b>" airline " Flights</b></h3><br>");

out.println("<table cellspacing=20 cellpaddinng=15>");

out.println("<tr><th>Flight No</th><th>From</th><th>To</th><th>Departure

Date</th><th>Arrival Date</th><th>Start Time</th>");

out.println("<th>Reach Time</th><th>Seats Remaining</th></tr>");

while(rs.next())

{

s1 = rs.getString(1);

flight_no[i] = s1;

s2 = rs.getString(2);

s3 = rs.getString(3);

s4 = rs.getString(4);

Page 58: Vce Web Tech Lab Manual It Batch

s5 = rs.getString(5);

s6 = rs.getString(6);

s7 = rs.getString(7);

s8 = rs.getString(8);

out.println("<tr><td>" s1 "</td>");

out.println("<td>" s2 "</td>");

out.println("<td>" s3 "</td>");

out.println("<td>" s4 "</td>");

out.println("<td>" s5 "</td>");

out.println("<td>" s6 "</td>");

out.println("<td>" s7 "</td>");

out.println("<td>" s8 "</td></tr>");

i ;

}

out.println("</table>");

if(i==1)

{

out.println("<br><center><b>Sorry!! No flights scheudle

available</b></center><br>");

}

else

{

out.println("<form name='AirlineList' action='" airline ".jsp' method='post'>");

out.println("<br><table><tr><td>Select Flight</td><td>");

out.println("<select name='flight_no'>");

for(int temp=1;temp<i;temp )

{

out.println("<option>" flight_no[temp] "</option>");

}

out.println("</select></td></tr><tr></tr>");

out.println("<tr><td><input type='hidden' name='no' value='" no "'</td>");

out.println("<td><input type='hidden' name='air_type' value='" type

"'</td></tr>");

for(int j=1;j<=Integer.parseInt(no);j )

{

out.println("<tr><th>Passenger " j " details</th></tr>");

out.println("<tr></tr>");

out.println("<tr><td>Name</td><td><input type='text' name='pas" j

"_name'</td></tr>");

out.println("<tr><td>Age</td><td><input type='text' name='pas" j

"_age'</td></tr>");

out.println("<tr><td>Sex</td><td><input type='text' name='pas" j

Page 59: Vce Web Tech Lab Manual It Batch

"_sex'</td></tr>");

out.println("<tr></tr>");

}

out.println("</table><br><br><input type='Submit' name='Submit' value='Book

Now'/></form>");

}

//out.println("<input name ='submit' value='Submit' type='submit'/>");

}

finally {

try { if( null != rs ) rs.close(); } catch( Exception ex ) {}

try { if( null != st ) st.close(); } catch( Exception ex ) {}

try { if( null != cn ) cn.close(); } catch( Exception ex ) {}

}

%>

</body>

</html>

Page 60: Vce Web Tech Lab Manual It Batch

OUTPUT:

Page 61: Vce Web Tech Lab Manual It Batch

Result:

Thus the web pages for two web services travel agent and airline service is created and

executed successfully.