Scribd
Upload
35 views52 pages

WT Lab Manual

Uploaded by

harimhs028
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOC, PDF, TXT or read online on Scribd
35 views52 pages

WT Lab Manual

Uploaded by

harimhs028
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOC, PDF, TXT or read online on Scribd
You are on page 1/ 52

PPG INSTITUTE OF TECHNOLOGY

NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035


(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

Lab Manual

CCS375 – Web Technologies Lab


PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

Ex.No:1 Image Map

Source Code

Save as india.html

<html>
<title>INDIA</title>
</head>
<frameset Rows="15%,85%">
<frame src="top1.HTML" name="frame1">
<frameset cols="500,*">
<frame src="frame.html" name="frame2">
<frame src="f3.html" name="frame3">
</frameset>
<html>

Save as frame.html

<html>
<img src="India_map.jpg" height="400" width="400" usemap="#Indiamap">
<map name="indiamap">
<area shape="circle" coords="130,140,10" alt="DELHI" href="delhi.html" TARGET=frame3>
<area shape="circle" coords="170,330,10" alt="CHENNAI" href="chennai.html"
TARGET=frame3>
<area shape="circle" coords="250,200,10" alt="KOLKATA" href="Kolkatta.html"
TARGET=frame3>
<area shape="circle" coords="70,250,10" alt="MUMBAI" href="mumbai.html"
TARGET=frame3>
<area shape="default" nohref>
</map>
</html>

Save as delhi.html

<html>
<head>
<center>
<b>
<font color="red" size="+5" face="script">
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

DELHI
</center>
</b>
</font>
</head>
<body>
<font color="silver" size="+3" face="arial"><p align="center">
Delhi is the capital of India.It is situated at the Northen region of India.There are many places of
historic importance.The Rashtrapathi Bavan,the President's Residence,is situated here.The
IndiaGate,Parliament,RedFort etc., are situated in Delhi.
</p>
</font>
</body>
</html>
Save as chennai.html

<html>
<head>
<center><b><font color="red" size="+5" face="script">Chennai</b></font></center>
<title>Chennai</title>
</head>
</body>
<font color=""red" size="+3" face="comic sans ms">
<p align="center">
Chennai is the capital of South India.It is a very old city and it was called as Madras.It is the
Capital of TamilNadu.
</p></font>
</body>
</html>

Save as mumbai.html

<html>
<head>
<center><b><font color="red" size="+5" face="script">Mumbai</b></font></center>
<title>Mumbai</title>
</head>
</body>
<font color=""red" size="+3" face="comic sans ms">
<p align="center">
Mumbai is the city where major business activities takes place.Mumbai is the city of Stock
Market.Mumbai is the capital of Maharashtra.
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

</p></font>
</body>
</html>

Save as kolkatta.html

<html>
<head>
<center><b><font color="red" size="+5" face="script">Kolkatta</b></font></center>
<title>Kolkatta</title>
</head>
</body>
<font color=""red" size="+3" face="comic sans ms">
<p align="center">
Kolkatta is the city of joy.It is the capital of the East and most populous city in the country.It is
the state capital of West Bengal.
</p></font>
</body>
</html>
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

Output
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

Ex.No:2 Cascading Style Sheet

Source code

Save as Home.html

<html>
<head>
<title>Cascading Style Sheets</title>
</head>
<body alink="blue" vlink="brown">
<h1><u><b><font face="Monotype corsiva" color="red">
Different types of Cascading Style Sheets</font> </b></u></h1>
<br />
<font face="Arial"size="6">
<a href ="inline.html" style="text-decoration :none;"> 1. Inline Style Sheet</a><br />
<a href ="external.html" style="text-decoration :none;"> 2. External Style Sheet</a><br />
<a href ="internal.html" style="text-decoration :none;"> 3. Internal Style Sheet</a><br
/></font>
</body>
</html>

Save as internal.html

<html>
<head>
<style type="text/css">
<!--
p {color: green;}
-->
</style> </head>
<body>
<p> The text in this paragraph will be green. </p>
<p> This paragraph too. </p>
</body>
</html>

Save as inline.html
<html>
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

<head>
<title>Inline Style Sheet</title>
</head>
<body>
<ol class="decimal">
<h1 style="font-family :Monotype Corsiva ;background-color:antiquewhite ;"><li>Inline Style
Sheet</li></h1>
<h3>
<p style="text-indent :30pt;color:blue;font-family :arial;">
Inine Style is the style attached to one specific element. The style is specified directly in the start
tag as a value of the style attribute well apply exclusively to this specific element occurrence.
</p></h3>
</ol>
</body>
</html>

Save as external.html
<html>
<head>
<title>External Style Sheet</title>
<link rel=Stylesheet href="style1.css" type="text/css" />
</head>
<body>
<h1>External Style Sheet</h1><br />
<h3>
An external style sheet is a template documents/files containing style info which can be linked
with any number
of the documents. This is a very convenient way of formating the entire site as well as restyling it
by editing just one file</h3>
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

</body>
</html>

The code from style1.css:

h3 {color:blue;
font-size:18 pt;
font-weight:bold}
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

Ex.No:3 Web Form Validation using DHTML

Save as formvalidation.html

<html>
<head>
<title> Form Validation Example </title>
<script language=javascript>
var Sex_Selected ;
var LanguagesKnown ;
var CourseSelected ;
function displayOutput ()
{
OutputWindow = window.open ("","Validation") ;
OutputWindow.document.writeln ("<h1><center>");
OutputWindow.document.writeln ("Validation Details");
OutputWindow.document.writeln ("</center></h1>");
OutputWindow.document.writeln (“<br>Name : “ , frmValidate.txt_Name.value )
;
OutputWindow.document.writeln ("<br>Father's Name : ",
frmValidate.txt_FatherName.value ) ;
OutputWindow.document.writeln ("<br>Mother's Name: ",
frmValidate.txt_MotherName.value);
OutputWindow.document.writeln ("<br>Date of Birth : ",
frmValidate.txt_DoB.value ) ;
OutputWindow.document.writeln ("&nbsp;&nbsp; Age : ",
frmValidate.txt_Age.value ) ;
OutputWindow.document.writeln ("<br>Sex : ", Sex_Selected ) ;
OutputWindow.document.writeln ("<hr>") ;
OutputWindow.document.writeln ("<br>Address : ",
frmValidate.txt_Address.value ) ;
OutputWindow.document.writeln ("<br>E-Mail ID : ",
frmValidate.txt_EmailID.value ) ;
OutputWindow.document.writeln ("<hr>") ;
OutputWindow.document.writeln ("<br>Language(s) Known : ", LanguagesKnown ) ;
OutputWindow.document.writeln ("<br>Course selected : ", CourseSelected ) ;
}

function ValidateName (srcField)


{
var srcStr = srcField.value ;
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

if ( srcStr == "" )
{
alert ("Please enter the name") ;
return false;
}

if ( srcStr.length > 8 )
{
alert ("Please enter only 8 characters as name") ;
return false ;

for (i=0; i<srcStr.length; i++)


{
if (! ( ((srcStr.charAt(i) >='a') && (srcStr.charAt(i) <='z'))||
((srcStr.charAt(i) >='A') && (srcStr.charAt(i) <='Z'))
)
)
{
alert ("Please enter only valid alphabets in the name") ;
return false ;
}
}
return true ;
}

function ValidateAge (srcField)


{
var srcStr = srcField.value ;

if ( srcStr == "" )
{
alert ("Please enter the age") ;
return false ;
}

if ( isNaN(srcStr) )
{
alert ("Please enter age in numbers") ;
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

return false ;
}
return true ;
}

function ValidateSex (srcField)


{
if ( !srcField[0].checked && !srcField[1].checked )
{
alert ("Please select the sex") ;
return false;
}

if (srcField[0].checked)
{
Sex_Selected = srcField[0].value ;
}
else
{
Sex_Selected = srcField[1].value ;
}

return true ;
}

function ValidateLanguagesKnown (srcField)


{
if ( !srcField[0].checked && !srcField[1].checked && !srcField[2].checked &&
!srcField[3].checked )
{
alert ("Please select the Languages known") ;
return false ;
}

LanguagesKnown = "" ;

for (i=0; i<srcField.length; i++)


{
if (srcField[i].checked)
{
LanguagesKnown = LanguagesKnown + srcField[i].value + ", " ;
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

}
}
return true ;
}

function ValidateCourseSelected (srcField)


{
var IsCourseSelected = 0 ;

for (i=0; i<srcField.length; i++)


{
if (srcField[i].selected)
{
IsCourseSelected = true ;
break ;
}
}

if (IsCourseSelected ==false)
{
alert ("Please select atleast one course") ;
return false ;
}

CourseSelected = "" ;

for (i=0; i<srcField.length; i++)


{
if (srcField[i].selected)
{
CourseSelected = CourseSelected + srcField[i].value + ", " ;
}
}
return true ;
}
function ValidateEMailID (srcField)
{
var srcStr = srcField.value ;

if ( srcStr == "" )
{
alert ("Please enter the email id") ;
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

return false ;
}

if ( srcStr.indexOf("@")== -1 )
{
alert("Invalid E-mail ID. Enter email id with @ symbol") ;
return false ;
}

if ( srcStr.indexOf("@")!= srcStr.lastIndexOf("@") )
{
alert("Invalid E-mail ID. More than 1 @ symbol are present") ;
return false ;
}

if ( srcStr.indexOf(".")== -1 )
{
alert("Invalid E-mail ID. Enter email id with . extension") ;
return false ;
}

if ( (srcStr.indexOf("@")== srcStr.length) || (srcStr.indexOf(".")== srcStr.length) ||


(srcStr.charAt(0) == "@") || (srcStr.charAt(0) == ".")
)
{
alert("Invalid E-mail ID") ;
return false ;
}
return true ;
}

function Validate ()
{
var status ;

status = ValidateName ( frmValidate.txt_Name ) ;

if (status == false) {
frmValidate.txt_Name.focus() ;
return false;
}
status = ValidateName ( frmValidate.txt_FatherName ) ;
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

if (status == false) {
frmValidate.txt_FatherName.focus() ;
return false;
}
status = ValidateName ( frmValidate.txt_MotherName ) ;

if (status == false) {
frmValidate.txt_MotherName.focus() ;
return false;
}

status = ValidateAge ( frmValidate.txt_Age ) ;

if (status == false) {
frmValidate.txt_Age.focus() ;
return false;
}

status = ValidateSex ( frmValidate.opt_Sex ) ;

if (status == false) {
return false;
}

status = ValidateEMailID ( frmValidate.txt_EmailID ) ;

if (status == false) {
frmValidate.txt_EmailID.focus() ;
return false;
}

status = ValidateLanguagesKnown ( frmValidate.chk_Language ) ;

if (status == false) {
return false;
}

status = ValidateCourseSelected ( frmValidate.lst_Course ) ;

if (status == false) {
return false;
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

}
displayOutput () ;
}

</script>

<style>

.TableStyle
{
font-family : Tahoma ;
font-size : 9pt ;
font-weight : bold ;
color : Black ;

}
</style>
</head>
<body bgcolor="#aad375">
<form method="get" name="frmValidate" onSubmit= "return Validate()">

<fieldset>
<legend align=center><font face="Tahoma" size=5 color="blue"><b> Application Form
</b></font></legend>

<table border=0 align="center" class = "TableStyle">


<tr>
<td> Name: </td>
<td> <input type="text" name=txt_Name size=25> </td>
</tr>

<tr>
<td> Father's Name: </td>
<td> <input type="text" name=txt_FatherName size=25></td>
</tr>

<tr>
<td> Mother's Name: </td>
<td> <input type="text" name=txt_MotherName size=25></td>
</tr>

<tr>
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

<td> Date of Birth: </td>


<td> <input type="text" name=txt_DoB size=25>

Age:
<input type="text" name=txt_Age size=5>
</td>
</tr>

<tr>
<td> Sex: </td>
<td> <input type="radio" name=opt_Sex value="Male"> Male
<input type="radio" name=opt_Sex value="Female"> Female
</td>
</tr>

<tr>
<td> Address: </td>
<td> <textarea name=txt_Address cols=19 rows=5></textarea> </td>
</tr>

<tr>
<td> Email ID: </td>
<td> <input type="text" name=txt_EmailID size=25></td>
</tr>

<tr>
<td> Language(s) known: </td>
<td>
<input type="checkbox" name=chk_Language value="Tamil"> Tamil
<input type="checkbox" name=chk_Language value="English"> English
<input type="checkbox" name=chk_Language value="Hindi"> Hindi
<input type="checkbox" name=chk_Language value="Other"> Other
</td>
</tr>

<tr>
<td> Course(s): </td>
<td>
<select name=lst_Course id=course multiple>
<option value=CSE> CSE </option>
<option value=IT> IT </option>
<option value=ECE> ECE </option>
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

<option value=EEE> EEE </option>


<option value=EI> E&amp;I </option>
<option value=MCA> MCA </option>
<option value=MSC> MSC </option>
<option value=MBA> MBA </option>
<option value=ME> ME </option>
<option value=MTECH> MTECH </option>
</select>

</td>
</tr>

</table>

<center>
<input type="submit" value="Submit">
<input type="reset" value="Clear">
</center>

</fieldset>
</form>
</body>
</html>
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

Output:
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

Ex.No:4 Color Palette creation using Applet

Source Code

import java.awt.*;
import java.awt.event.*;
import java.applet.*;
/*
<applet code="ex4" width=500 height=500>
<param name = "recmb" value = "sunset.jpg">
<param name = "recwsb" value = "India_map.jpg">
</applet>
*/
public class ex4 extends Applet implements ActionListener, ItemListener
{
Button btnRed, btnGreen, btnBlue;
String str = "";
CheckboxGroup cbgColor;
CheckboxGroup cbgImage;
Checkbox optFore, optBack;
Checkbox optMb, optWsb;
Image imgMb, imgWsb;
TextArea txtaComments = new TextArea("", 5, 30);
public void init()
{
setLayout(new GridLayout(4, 3));
cbgColor = new CheckboxGroup();
cbgImage = new CheckboxGroup();
Label lblColor = new Label("Select the Area :") ;
Label lblImage = new Label("Select the Image :") ;
optFore = new Checkbox("Foreground", cbgColor,true);
optBack = new Checkbox("Background", cbgColor,false);
optMb = new Checkbox("REC-Main Block", cbgImage,true);
optWsb = new Checkbox("REC-Workshop Block",cbgImage, false);
btnRed = new Button("Red");
btnGreen = new Button("Green");
btnBlue = new Button("Blue");
imgMb = getImage(getDocumentBase(),getParameter("recmb"));
imgWsb = getImage(getDocumentBase(),getParameter("recwsb"));
add(btnRed);
add(btnGreen);
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

add(btnBlue);
add(lblColor);
add(optFore);
add(optBack);
add(lblImage);
add(optMb);
add(optWsb);
add(txtaComments);
optFore.addItemListener(this);
optBack.addItemListener(this);
optMb.addItemListener(this);
optWsb.addItemListener(this);
btnRed.addActionListener(this);
btnGreen.addActionListener(this);
btnBlue.addActionListener(this);
}
public void actionPerformed(ActionEvent ae) {
str = cbgColor.getSelectedCheckbox().getLabel() ;
if(ae.getSource() == btnRed && str.equals("Background"))
{
txtaComments.setBackground(Color.red);
}
if(ae.getSource() == btnRed && str.equals("Foreground"))
{
txtaComments.setForeground(Color.red);
}
if(ae.getSource() == btnGreen && str.equals("Background"))
{
txtaComments.setBackground(Color.green);
}
if(ae.getSource() == btnGreen && str.equals("Foreground"))
{
txtaComments.setForeground(Color.green);
}
if(ae.getSource() == btnBlue && str.equals("Background"))
{
txtaComments.setBackground(Color.blue);
}

if(ae.getSource() == btnBlue && str.equals("Foreground"))


{
txtaComments.setForeground(Color.blue);
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

}
}
public void itemStateChanged(ItemEvent ie)
{
repaint();
}
public void paint(Graphics g)
{
if(optMb.getState() == true)
g.drawImage(imgMb, 200, 400, this) ;
if(optWsb.getState() == true)
g.drawImage(imgWsb, 200, 400, this) ;
}}
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

Output:
Compile ex4 program

C:\IPLAB>javac ex4.java

Run the ex4 program


C:\IPLAB>appletviewer ex4.java
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

Ex.No:5 Invoking Servlets from HTML

Save as invokeServlet.html

<html>
<head>
<title>Student Information Form</title>
</head>
<body>
<center>
<form name="form1" action="my_servletDemo">
<h3>Enter student information in following fields </h3>
<table>
<tr>
<td><b>Roll Number</b></td>
<td><input type="text" name="Roll Number" size="25" value=" "></td>
</tr>

<tr>
<td><b>Student Name</b></td>
<td><input type="text" name="Student Name" size="25" value=" "></td>
</tr>

<tr>
<tr>
<td><b>Student Address</b></td>
<td><input type="text" name="Address" size="50" value=" "></td>
</tr>

<tr>
<td><b>Phone</td>
<td><input type="text" name="Phone" size="25" value=" "></td>
</tr>

<tr>
<td><b>Total Marks</td>
<td><input type="text" name="Total Marks" size="10" value=" "></td>
</tr>

</table>
<input type="submit" value="submit">
</form>
</center>
</body>
</html>
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

Save as my_servletDemo.java

package pack;
import java.io.*;
import java.util.*;
import javax.servlet.*;
public class my_servletDemo extends GenericServlet
{
public void service(ServletRequest req,ServletResponse res)
throws ServletException,IOException
{
PrintWriter out=res.getWriter();
Enumeration en=req.getParameterNames();
while(en.hasMoreElements())
{
String name_received=(String)en.nextElement();
out.print(name_received+ " = ");
String value_received=req.getParameter(name_received);
out.println(value_received);
out.println(" ");
}
out.close();
}
}

Save as web.xml

<?xml version="1.0" encoding="UTF-8"?>


<web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
<servlet>
<servlet-name> my_servletDemo </servlet-name>
<servlet-class>pack. my_servletDemo </servlet-class>
</servlet>
<servlet-mapping>
<servlet-name> my_servletDemo </servlet-name>
<url-pattern>/ my_servletDemo </url-pattern>
</servlet-mapping>

</web-app>
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

Output:

1. Create a folder named hello1 in webapps folder.


2. In hello1 create two folders pack and WEB-INF.
3. Save student.html in webapps\ hello1 folder.
4. Create a folder classes and lib in webapps\ hello1\pack\WEB-INF folder.
5. Save my_servletDemo.java in webapps\ hello1\pack folder.
6. Compile my_servletDemo.java and save its class file in \ hello1\pack\WEB-INF\classes\pack
folder.
7. Save web.xml in \ hello1\pack\WEB-INF folder.
8. Now run your application in the browser as shown below.
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

Ex.No:6 Online Examination using Servlet

Save as onlineexam.html
<html>
<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="StudentServlet3" 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>
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

</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/>

<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></body></html>

Save as StudentServlet3.java

package pack;
import java.sql.*;
import java.io.*;
import java.util.*;
import javax.servlet.*;
import javax.servlet.http.*;

public class StudentServlet3 extends HttpServlet


{
String SeatNum,Name;
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

String ans1,ans2,ans3,ans4,ans5;
int a1=0,a2=0,a3=0,a4=0,a5=0;

Connection connect=null;
Statement stmt=null;
ResultSet rs=null;
public void doPost (HttpServletRequest request,HttpServletResponse response) throws ServletException,
IOException
{
//Establishing Connection to the Database
try
{
Class.forName("sun.jdbc.odbc.JdbcOdbcDriver");
String url = "jdbc:odbc:StudentDB1";
connect = DriverManager.getConnection(url, " ", " ");
}
catch(ClassNotFoundException e){e.printStackTrace();}
catch(SQLException e){e.printStackTrace();}
catch(Exception e){e.printStackTrace();}

//Gathering parameters from HTML form

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"))
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

a5=0;
else
a5=2;
int Total=a1+a2+a3+a4+a5;

//inserting values in the database


try
{
stmt = connect.createStatement();
String query = "INSERT INTO StudentTable (" + "Seat_no,Name,Marks" + ") VALUES ('"
+SeatNum + "', '" + Name + "', '"+Total+ "')";
int result = stmt.executeUpdate(query);
stmt.close();
}catch(SQLException e) {}

//retrieving the records from database

response.setContentType("text/html");
PrintWriter out=response.getWriter();
out.println("<html>");
out.println("<head>");
out.println("</head>");
out.println("<body bgcolor=pink>");
out.println("<center>");
out.println("<br><br>");
out.println("<h2>Students Database</h2>");
out.println("<table border=5>");
try
{
stmt = connect.createStatement();
String query = "SELECT * FROM StudentTable WHERE Name="+"'"+Name+"'";
rs = stmt.executeQuery(query);
out.println("<th>"+"Seat_no"+"</th>");
out.println("<th>"+"Name"+"</th>");
out.println("<th>"+"Marks"+"</th>");

while(rs.next())
{

out.println(" <tr>");
out.println(" <td>"+rs.getInt(1)+"</td>");
out.println(" <td> "+rs.getString(2)+" </td>");
out.println(" <td> "+rs.getString(3)+" </td>");
out.println(" </tr>");
}
out.println("</table>");
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

}catch(SQLException e){}

finally
{

try
{
if(rs!=null)
rs.close();
if(stmt!=null)
stmt.close();
if(connect!=null)
connect.close();
}catch(SQLException e){}
out.println("<h1>Thanks</h1>\n");
out.println("</table>");
out.println("</center>");
out.println("</body></html>");
}
}}

Save as web.xml

<?xml version="1.0" encoding="UTF-8"?>


<web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
<servlet>
<servlet-name>StudentServlet3</servlet-name>
<servlet-class>pack.StudentServlet3</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>StudentServlet3</servlet-name>
<url-pattern>/StudentServlet3</url-pattern>
</servlet-mapping>

</web-app>

Output:
1. Create a folder named onlineservlet in webapps folder.
2. In onlineservlet create two folders pack and WEB-INF.
3. Save onlineexam.html in webapps\ onlineservlet folder.
4. Create a folder classes and lib in webapps\ onlineservlet \pack\WEB-INF folder.
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

5. Create a database using Ms-access named Studentdb1.mdb and stored in webapps\ onlineservlet \
pack folder.
6. Create a DSN named StudentDB1 using ODBC administrator in the control panel.

7. Save StudentServlet3.java in webapps\ onlineservlet \pack folder.


8. Compile StudentServlet3.java and save its class file in \ onlineservlet \pack\WEB-INF\classes\
pack folder.
9. Save web.xml in \ onlineservlet \pack\WEB-INF folder.
10. Now run your application in the browser as shown below.
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

Tier 1: onlineexam.html

Tier 2: StudentServlet
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

Tier 3: Studentdb.mdb
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

Ex.No:7 Online Examination using JSP

Save as Exam.jsp

<%@ 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
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

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

stmt = connect.createStatement();
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> R.M.K. College of Engg. & Tech.</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: R.M.K. <b></td></tr>
</table>
<div>
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

<a href=" Exam.jsp">Click here to go back</a>


</body>
</html>
<%}else{%>
<html>
<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>
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

</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/>

<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>
<%}%>

Output:

1. Create a folder named onlineexam in webapps folder.


2. Create a database using Ms-access named Studentdb1.mdb and stored in webapps\ onlineexam
folder.
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

3. Create a DSN named StudentDB1 using ODBC administrator in the control panel.

4. Save Exam.jsp in onlineexam folder.


5. Now run your application in the browser as shown below.
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

Tier -1 Exam.jsp

Tier -2 Exam.jsp
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

Tier -1 Studentdb.mdb

Ex.No:8 Program using XML / XSLT

Save as SimpleXml.xml

<?xml version="1.0" encoding="UTF-8"?>

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


<Student>
<Person-Details>
<name>Anand</name>
<address>Pune</address>
<std>Second</std>
<marks>70 percent</marks>
</Person-Details>
<Person-Details>
<name>Anuradha</name>
<address>Chennai</address>
<std>Second</std>
<marks>90 percent</marks>
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

</Person-Details>
<Person-Details>
<name>Archana</name>
<address>Mumbai</address>
<std>Forth</std>
<marks>80 percent</marks>
</Person-Details>
<Person-Details>
<name>Monika</name>
<address>Delhi</address>
<std>Tenth</std>
<marks>77 percent</marks>
</Person-Details>
</Student>

Save as SimpleXml.xsl

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


<xsl:stylesheet version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
<html>
<body>
<h2>Students Database</h2>
<table border="1">
<tr bgcolor="gray">
<th>Name</th>
<th>Address</th>
<th>Standard</th>
<th>Marks</th>
</tr>
<xsl:for-each select="Student/Person-Details">
<tr bgcolor="pink">
<td><xsl:value-of select="name"/></td>
<td><xsl:value-of select="address"/></td>
<td><xsl:value-of select="std"/></td>
<td><xsl:value-of select="marks"/></td>
</tr>
</xsl:for-each>
</table>
</body>
</html>
</xsl:template>
</xsl:stylesheet>

Output:
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

1. Create and save the above two files in a folder.


2. Run SimpleXml.xml in the browser.
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

Ex.No:9a DOM – Tree based Parsing

Save as Parsing_DOMDemo.java

import java.io.*;
import javax.xml.parsers.*;
import org.w3c.dom.*;
import org.xml.sax.*;

public class Parsing_DOMDemo


{
public static void main(String[] arg)
{
try
{
System.out.print("Enter the name of XML document ");
BufferedReader input = new BufferedReader(new
InputStreamReader(System.in));
String file_name = input.readLine();
File fp = new File(file_name);
if(fp.exists())
{
try
{
DocumentBuilderFactory Factory_obj =
DocumentBuilderFactory.newInstance();
DocumentBuilder builder = Factory_obj.newDocumentBuilder();
InputSource ip_src = new InputSource(file_name);
Document doc = builder.parse(ip_src);
System.out.println(file_name + " is well-formed!");
}
catch (Exception e)
{
System.out.println(file_name + " isn't well-formed!");
System.exit(1);
}
}
else
{
System.out.print("File not found!");
}
}
catch(IOException ex)
{
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

ex.printStackTrace();
}
}
}

Save as student.xml

<?xml version="1.0" ?>


<student>
<Roll_No>10</Roll_No>
<Personal_Info>
<Name>Parth</Name>
<Address>Pune</Address>
<Phone>1234567890</Phone>
</Personal_Info>
<class>Second</class>
<Subject>Mathematics</Subject>
<Marks>100<Marks>
</student>

Output:

Z:\WEB TECh\class notes\Web_Technology_AU>set path=C:\Program Files\Java\jdk1.6.0\bin

Z:\WEB TECh\class notes\Web_Technology_AU>set classpath=%classpath;

Z:\WEB TECh\class notes\Web_Technology_AU>javac Parsing_DOMDemo.java

Z:\WEB TECh\class notes\Web_Technology_AU>java Parsing_DOMDemo


Enter the name of XML document student.xml
[Fatal Error] student.xml:12:3: The element type "Marks" must be terminated by the matching end-tag
"</Marks>".
student.xml isn't well-formed!

Z:\WEB TECh\class notes\Web_Technology_AU>


PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

Ex.No:9b SAX – Event based Parsing

Save as Parsing_SAXDemo.java

import java.io.*;
import org.xml.sax.*;
import org.xml.sax.helpers.*;

public class Parsing_SAXDemo


{
public static void main(String[] args) throws IOException
{
try
{
System.out.print("Enter the name of XML document ");
BufferedReader input = new BufferedReader(new
InputStreamReader(System.in));
String file_name = input.readLine();
File fp = new File(file_name);
if (fp.exists())
{
try
{
XMLReader reader = XMLReaderFactory.createXMLReader();
reader.parse(file_name);
System.out.println(file_name + " is well-formed.");
}
catch (Exception e)
{
System.out.println(file_name + " is not well-formed.");
System.exit(1);
}

}
else
{
System.out.println("File is not present: " + file_name);
}
}
catch (IOException ex){ex.printStackTrace();}
}
}
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

Save as student.xml

<?xml version="1.0" ?>


<student>
<Roll_No>10</Roll_No>
<Personal_Info>
<Name>Parth</Name>
<Address>Pune</Address>
<Phone>1234567890</Phone>
</Personal_Info>
<class>Second</class>
<Subject>Mathematics</Subject>
<Marks>100<Marks>
</student>

Output:

Z:\WEB TECh\class notes\Web_Technology_AU>set path=C:\Program Files\Java\jdk1.6.0\bin

Z:\WEB TECh\class notes\Web_Technology_AU>set classpath=%classpath;

Z:\WEB TECh\class notes\Web_Technology_AU>javac Parsing_SAXDemo.java

Z:\WEB TECh\class notes\Web_Technology_AU>java Parsing_SAXDemo


Enter the name of XML document student.xml
[Fatal Error] student.xml:12:3: The element type "Marks" must be terminated by the matching end-tag
"</Marks>".
student.xml is not well-formed.

Z:\WEB TECh\class notes\Web_Technology_AU>


PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

Ex.No:10 Program using Ajax

Save as ajax.html

<! DOCTYPE html PUBLIC "-//w3c//DTD// XHTML 1.0 Traditional //EN"


"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head>
<title>Program using AJAX</title>
<script language="javascript" src="ajax.js"></script>
<script language="javascript">
function doSomethingWithData(str)
{
document.getElementById('MyId').innerHTML=str;
}
</script>
</head>
<body>
<h1>AJAX Tutorial:Example1</h1>
this example show how to dynamically retrieve data from a javascript file<br><br>
<input type="button" value="data file #1" onclick="loadscript('data1.js')" />
<input type="button" value="data file #2" onclick="loadscript('data2.js')" />
<input type="button" value="data file #3" onclick="loadscript('data3.js')" />
<p>
<div id="MyId">&nbsp;</div>
</p>
<hr>
<ul>
<li>
<h3>html</h3>
</li>
<li>
<h3>xml</h3>
</li>
</ul>
</body>
</html>

Save as ajax.js

function loadscript(scriptURL)
PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

{
var newScript=document.createElement("script");
newScript.src=scriptURL;
document.body.appendChild(newScript);
}
function loadData(URL)
{
xmlReq=null;
if(window.XMLHttpRequest)
xmlReq=new XMLHttpRequest();
else if(window.ActiveObject)
xmlReq=new ActiveObject("Microsoft.XMLHttp");
if(xmlReq=null)
return;
xmlReq.onreadystatechange=function()
{
switch(xmlReq.readystate)
{
case 0:
break;
case 1:
break;
case 2:
breeak;
case 3:
break;
case 4:
doSomethingWithData(xmlReq.responseXML.getElementByTagName('quote')
[0].firstChild.data);
break;
default :
break;
}
}
xmlReq.open('GET',URL,true);
xmlReq.send(null);
}

Save as data1.js

doSomethingWithData("this textis from Data1.js");

Save as data2.js

doSomethingWithData("this textis from Data2.js");


PPG INSTITUTE OF TECHNOLOGY
NH – 209, Sathy Road, Saravanampatti, Coimbatore – 641 035
(Approved by AICTE, New Delhi & Affiliated to Anna University, Chennai)
UGC Recognized I ISO 9001:2015 Certified

Save as data3.js

doSomethingWithData("this textis from Data3.js");

You might also like