CS2358 INTERNET PROGRAMMING LABORATORY LABORATORY MANUAL FOR VI SEMESTER B.

E / CSE ACADEMIC YEAR: 2013 2014 (EVEN)

DEPARTMENT OF COMPUTER SCIENCE AND ENGINEERING

GKM COLLEGE OF ENGINEERING & TECHNOLOGY CHENNAI-63

G.K.M. College of Engineering & Technology (Sponsored by SUGANTHI EDUCATIONAL TRUST) Alapakkam - Mappedu Road, G.K.M. Nagar, Chennai -600 063.

CS2358 INTERNET PROGRAMMING LAB LABORATORY MANUAL

HEAD OF THE DEPARTMENT DEPT OF COMPUTER SCIENCE & ENGINEERING GKMCET

GENERAL INSTRUCTIONS FOR LABORATORY CLASSES

DOS Without Prior permission do not enter into the Laboratory. While entering into the LAB students should wear their ID cards. The Students should come with proper uniform. Students should sign in the LOGIN REGISTER before entering into the laboratory. Students should come with observation and record note book to the laboratory. Students should maintain silence inside the laboratory. After completing the laboratory exercise, make sure to shutdown the system properly. DONTS Students bringing the bags inside the laboratory wearing slippers/shoes insides the laboratory. Students using the computers in an improper way. Students scribbling on the desk and mishandling the chairs. Students using mobile phones inside the laboratory.

CS2358 INTERNET PROGRAMMING LABORATORY

LIST OF EXPERIMENTS
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: 5. 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 6. Write programs in Java using Servlets: To invoke servlets from HTML forms To invoke servlets from Applets 7. Write programs in Java to create three-tier applications using JSP and Databases 1. 2. for conducting on-line examination. for displaying student mark list. Assume that student information is available in

database which has been stored in a database server. 8. Programs using XML Schema XSLT/XSL 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.

TEXT BOOK: 1. Robert W.Sebesta, Programming the world wide web, Pearson Education, 2006.

Objective: To learn the concepts of website designing, client& server side programming and web services.

Session No

Exercise No

Exercises

Time Allocation

Simple Web page creation Create a web page with the following using HTML i) To embed an image map in a web page

150m

150m

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

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

Client Side Scripts for Validating Web Form Controls using DHTML 150m

Write programs in Java to create applets incorporating the following features: 5,6 5 Create a color palette with matrix of buttons 150m

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 Write programs in Java using Servlets: 7,8 6 To invoke servlets from HTML forms To invoke servlets from Applets 150m

Write programs in Java to create three-tier applications using JSP and Databases 9,10 7 a. for conducting on-line examination. b.for displaying student mark list. Assume that student information is available in a database which has been stored in a database server.

150m

11

Programs using XML Schema XSLT/XSL

150m 150m

12

Programs using AJAX 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. 150m

13,14

10

Implement this scenario using Web Services and Data base.

15

Model Examination

150m

1)

IMAGE MAPPING USING HTML AIM: Create a web page with the following using HTML

To embed an image map in a web page To fix the hot spots Show all the related information when the hot spots are clicked.

STEPS:
1. 2.

Insert an image in the web page by using <img> element. Define an image map by using <map> element and use the

name attribute to identify the image map.

3.

Define the hotspots (certain areas of an image) by using

<area> element with the following attributes:

href specifies the target of the link. shape specifies the shape of the hotspots. coords specifies the coordinate values of the hotspots Use an image map with an <img> element by using the usemap

4.

attribute.
5.

Display the web page and click the hotspots to display the

related information.

PROGRAM: india.html <html> <head> <title>Image Mapping....</title> </head> <body> <h1 align="center"><font face="Forte"color="violet">INDIA</font></h1> <hr> <p> <font size="3" face="Comic Sans MS"color="darkblue"> <ul> <li>The name India is derived from Indus, which is derived from the Old Persian word Hindu, from Sanskrit</li> <li>India is the seventh-largest country by geographical area</li> <li>The second-most populous country with over 1.2 billion people</li> <li>The most populous democracy in the world</li> <li>Consisting of 28 states and seven union territories</li> <li>The name India is derived from Indus, which is derived from the Old Persian word Hindu, from Sanskrit</li> </ul> <p> <font size="4" face="Calibri"color="red"> Click On The Hotspots To View More Information About That Particular Places... </font> </p> <map name="indiamap">

<area shape="rect" coords="105,202,112,207" href="chennai.html" alt="Click here to get more details"> <area shape="rect" coords="84,84,91,89" href="delhi.html" alt="Click here to get more details"> <area shape="rect" coords="57,157,63,162" href="mumbai.html" alt="Click here to get more details"> <area shape="rect" coords="179,126,185,131" href="kolkatta.html" alt="Click here to get more details"> </map> <img src="india.jpg" border=0 usemap="#indiamap"> </body> </html> chennai.html <html> <Title>Chennai....</title> <body> <p><font face="Cambria" color="blue" size="3">Chennai, formerly known as Madras or Madarasapatinam, is the capital city of the Indian state of Tamil Nadu...</font></p> <table> <tr> <td><img src="Parrys.jpg"><br> <font face="Cambria" color="blue" size="3">Parry's Corner</td> <td> <font face="Cambria" color="blue" size="2"> <ul> <li>Chennai being the fourth most populous metropolitan area and the fifth most populous city in India</li>

<li>It is also the world's 36th largest metropolitan area</li> <li>Chennai's economy has a broad industrial base in the automobile, computer, technology, hardware manufacturing, and healthcare industries</li> <li>The city is India's second largest exporter of software, information technology (IT) and information-technology-enabled services (ITES)</li> <li>Chennai is a major centre for music, art and culture in India</li> <li>The city is known for its classical dance shows and Hindu temples</li> <li>Cricket is the most popular sport in Chennai</li> <li>Chennai is the base for the large Tamil movie industry, known as Kollywood, home to most of the movie studios</li> </ul> </td> </tr> </table> <font face="Cambria" color="blue" size="2"> <a href="india.html">Home</a> </font> </body> </html> mumbai.html <html> <Title>Mumbai....</title> <body> <p><font face="Cambria" color="blue" size="3">It is the most populous city in India, and the second most populous city in the world, with a population of approximately 14 million...</font></p> <table>

<tr> <td><img src="Gateway.jpg"><br> <font face="Cambria" color="blue" size="3">Gateway Of India</td> <td> <font face="Cambria" color="blue" size="2"> <ul> <li>Mumbai, formerly known as Bombay </li> <li>Mumbai is the capital of the Indian state of Maharashtra</li> <li>Mumbai is the commercial and entertainment capital of India</li> <li>The average annual temperature is 27.2 C (81.0 F)</li> </ul> </td> </tr> </table> <font face="Cambria" color="blue" size="2"> <a href="india.html">Home</a> </font> </body> </html> delhi.html <html> <Title>Delhi....</title> <body> <p><font face="Cambria" color="blue" size="3">Delhi is the eighth largest metropolis in the world by population with more than 12.25 million people...</font></p> <table> <tr>

<td><img src="LotusTemple.jpg"><br> <font face="Cambria" color="blue" size="3">Lotus Temple</td> <td> <font face="Cambria" color="blue" size="2"> <ul> <li>Which also includes Noida, Greater Noida, Ghaziabad, Gurgaon and Faridabad along with other smaller nearby towns</li> <li>Delhi has a maximum length of 51.9 km (32 mi) and the maximum width of 48.48 km (30 mi)</li> <li>The annual mean temperature is 25 C (77 F)</li> <li>The average annual rainfall is approximately 714 mm (28.1 inches)</li> </ul> </td> </tr> </table> <font face="Cambria" color="blue" size="2"> <a href="india.html">Home</a> </font> </body> </html> kolkatta.html <html> <Title>Kolkata....</title> <body> <p><font face="Cambria" color="blue" size="3">Kolkata is the cultural capital of India and the commercial capital of Eastern India...</font></p> <table>

<tr> <td><img src="VictoriaMemorial.jpg"><br> <font face="Cambria" color="blue" size="3">Victoria Memorial</td> <td> <font face="Cambria" color="blue" size="2"> <ul> <li>Kolkata, formerly known as Calcutta, is the capital of the Indian state of West Bengal</li> <li>Before 1690 Kolkata, under direct rule of the Nawab of Bengal Siraj-UdDaulah</li> <li>Kolkata is located in the eastern part India</li> <li>The annual mean temperature is 26.8 C (80.2 F)</li> </ul> </td> </tr> </table> <font face="Cambria" color="blue" size="2"> <a href="india.html">Home</a> </font> </body> </html>

2)WEB PAGE USING CASCADING STYLE SHEETS(CSS) AIM: To create a web page with the following Cascading style sheets (CSS)

Inline style Embedded style External style

STEPS:
1.

Declare an individual elements style by using style attribute

(Inline style).
2.

Embed the entire style rules in an HTML documents head

section (Embedded style) by using <style> element as follows. <style type="text/css">

3.

Create the separate document that contain only CSS rules

(External style) and save it as extStyle.css.

4.

Create the link between the external style rules (extStyle.css)

and HTML document by using <link> element as follows. <link rel="stylesheet" type="text/css" href="extStyle.css"/>

PROGRAM: CSSDemo.html <html> <head> <title>Sachin Tendulkar</title> <style type="text/css"> #tid1{background-color:gray;width:800;height:200} #tid2{background-color:gray;width:800;height:300} img{width:794;height:200} </style> <link rel="stylesheet" type="text/css" href="extStyle.css"/> </head> <body> <h1 style="text-align:center;font-family:Courier New;color:blue">Sachin Ramesh Tendulkar</h1> <hr/> <table id="tid1" align="Center"> <tr> <td><img src="sachin.jpg"></td> </tr> </table> <table id="tid2" align="Center"> <tr> <td class="cls1" valign="top"> <h3 style="font-family:Lucida Sans Unicode;color:blue">Profile</h3> <p> Sachin Ramesh Tendulkar was born on 24 April 1973 in Mumbai. Sachin Tendulkar is an Indian cricketer. He has been the most complete batsman of

his time. He holds several batting records, including the most Test centuries and the most one-day international centuries, and was rated in 2002 by Wisden as the second greatest Test batsman ever, after Sir Don Bradman. He received the Rajiv Gandhi Khel Ratna, Indias highest sporting honour, for 1997-1998, and the civilian award Padma Shri in 1999. Tendulkar was a Wisden Cricketer of the Year in 1997. </p> </td> <td class="cls1" valign="top"> <h3 style="font-family:Lucida Sans Unicode;color:blue">Highlights of Tendulkars Career</h3> <div style="font-size:10pt;color:gold;font-family:Lucida Sans Unicode;textalign:justify"> <ul type="square"> <li>Highest number of Test centuries (51)</li> <li>Highest number of ODI centuries (49)</li> <li>First cricketer to cross 10,000 runs in both ODIs and Test</li> <li>Highest batting average among batsmen with over 10,000 ODI runs</li> <li>In 1998 he hit 9 ODI centuries, the highest by any player in an year</li> <li>673 runs in 2003 World Cup, highest by any one in a single Cricket World Cup</li> <li>First ceicketer to reach double century in ODI</li> <li>Played in the highest number of Cricket Grounds</li> <li>Rated as the second best batsman of all time (next to Don Bradman) by Wisden.</li> </ul> </div>

</td> </tr> </table> </body> </html> extStyle.css body{background-color:black} .cls1{width:325;height:300} p{font-family:Lucida Sans Unicode;color:silver;font-size:12pt;textalign:justify}

3)WEB FORM VALIDATION USING JAVA SCRIPT AIM: To create a web form with client side validation using Java script. STEPS:
1.

Insert a <form> element in the HTML document with the

following attributes:

name to identify the form element. action specifies the target of the form data to be submitted. onsubmit to call the Java script validation function when the

submit button is pressed.

2.

Insert all the necessary form elements such as <input>,

<textarea>, <select>, and <fieldset>.

3.

Insert various types of input fields (such as text, radio,

checkbox, and submit) by using type attribute of <input> element.

4.

Embed the form validation function within the head section of

the HTMLdocument by using <script> element as follows: <script type="text/javascript">

PROGRAM: FormValidation.html <html> <head> <title>Form Validation Using Java Script</title> <script type="text/javascript"> function validation() { if(document.f1.name.value=="") { window.alert("Plz Enter Your Name"); return false; } else if(document.f1.email.value=="") { window.alert("Plz Enter Your E-mail:"); return false; } else if(document.f1.email.value.indexOf('@gmail.com')==-1) { window.alert("Plz Enter Your Valid E-mail"); return false; } else if(document.f1.addr.value=="") { window.alert("Plz Enter Your Address"); return false; }

else if(document.f1.country.selectedIndex==0) { window.alert("Plz Select Your Country"); return false; } else if((document.f1.rdo[0].checked==false)&&(document.f1.rdo[1].checked==f alse)) { window.alert("Plz Choose Your Gender"); return false; } else if((document.f1.chk[0].checked==false)&&(document.f1.chk[1].checked==f alse)) { window.alert("Plz Select Your Qualification"); return false; } else return true; } </script> </head> <body bgcolor="lightgreen"> <h3 style="text-align:center">Web Form Validation Using Java Script</h3> <form name="f1" action="Register.html" onsubmit="return validation()"> <fieldset> <legend>Registration Form</legend>

<br/> <table border="1"> <tr> <td>Name:</td> <td><input type="text" name="name"></td> </tr> <tr> <td>E-mail:</td> <td><input type="text" name="email"></td> </tr> <tr> <td>Address:</td> <td><Textarea name="addr" rows="5" cols="20"></Textarea></td> </tr> <tr> <td>Country:</td> <td> <select name="country"> <option>---Select Your Country---</option> <option>India</option> <option>USA</option> <option>AUS</option> <option>UK</option> </select> </td> </tr> <tr> <td>Gender:</td> <td>

<input type="radio" name="rdo">Male <input type="radio" name="rdo">Female </td> </tr> <tr> <td>Qualification:</td> <td> <input type="checkbox" name="chk">B.E <input type="checkbox" name="chk">M.E </td> </tr> </table> <br/> <input type="submit" value="Register"> </fieldset> </form> </body> </html> Register.html <html> <head> <title>Registration Successfull</title> </head> <body> <h3>Registered Successfully.......!</h3> </body> </html>

4) COLOR PALETTE USING JAVA AIM: To write the java program 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. ALGORITHM:

1. 2.

Import all necessary packages and classes. Define a class CPalette that extends Applet and implements the

interfaces ActionListener and ItemListener.

3.

Define the objects for the controls such as Button,

CheckboxGroup, Checkbox and TextArea.

4. 5. 6.

Add all the controls by using the init() method of Applet class. Arrange all the controls by using the method setBounds(). Set the background color for each buttons by using the method

setBackground().
7.

Make the controls to listen the action by using the method

addActionListener().
8. 9.

Make the frame visible by using the method setVisible(). If the item state value s=1, change the background of the

control TextArea.
10.

If the item state value s=2, change the foreground of the control

TextArea.

11.

Compile the java file (CPalette.java) by using the following C:\jdk1.3.1\bin>javac CPalette.java

command line:

12. 13.

Create the <applet> code and save it as ColorPalette.html. Run the HTML file (ColorPalette.html) in Internet Explorer.

PROGRAM: CPalette.java import java.applet.*; import java.awt.*; import java.awt.event.*; public class CPalette extends Applet implements ActionListener,ItemListener { Button b1,b2,b3,b4; CheckboxGroup cg; Checkbox c1,c2; TextArea ta; int s; public void init() { setLayout(null); b1=new Button(); add(b1); b1.setBounds(50,50,50,25); b1.addActionListener(this); b1.setBackground(Color.blue); b2=new Button();

add(b2); b2.setBounds(120,50,50,25); b2.addActionListener(this); b2.setBackground(Color.black); b3=new Button(); add(b3); b3.setBounds(50,95,50,25); b3.addActionListener(this); b3.setBackground(Color.red); b4=new Button(); add(b4); b4.setBounds(120,95,50,25); b4.addActionListener(this); b4.setBackground(Color.cyan); cg=new CheckboxGroup(); c1=new Checkbox("Background",cg,false); add(c1); c1.setBounds(50,200,100,25); c1.addItemListener(this); c2=new Checkbox("Foreground",cg,false); add(c2); c2.setBounds(50,250,100,25); c2.addItemListener(this); ta=new TextArea(); add(ta); ta.setBounds(150,150,120,120); setVisible(true); } public void itemStateChanged(ItemEvent ie)

{ if(c1.getState()==true) s=1; if(c2.getState()==true) s=2; } public void actionPerformed(ActionEvent ae) { if(s==1) { if(ae.getSource()==b1) ta.setBackground(Color.blue); else if(ae.getSource()==b2) ta.setBackground(Color.black); else if(ae.getSource()==b3) ta.setBackground(Color.red); else ta.setBackground(Color.cyan); } if(s==2) { if(ae.getSource()==b1) ta.setForeground(Color.blue); else if(ae.getSource()==b2) ta.setForeground(Color.black); else if(ae.getSource()==b3) ta.setForeground(Color.red); else ta.setForeground(Color.cyan);

} } } ColorPalette.html <html> <head> <title>Color Palette Demonstration</title></head> <body bgcolor="lightblue"> <applet </applet> </body> </html> code="CPalette.class" width="300" height="400">

5) INVOKING SERVLETS FROM HTML FORM AIM: To write a java program to invoke servlets from HTML forms. ALGORITHM:
1.

Write

a client side

HTML

program (client.html) with the

following:

Insert a <form> that contains the fields such as text, password

and one submit button.

Set the URL of the server as the value of forms action

attribute.
2.

Write a java servlet program (server.java) with the following: Define a class server that extends the property of the class

GenericServlet.

Handle the request from the client by using the method service()

of GenericServlet class.

Get the parameter names from the HTML form by using the

method getParameterNames().

Get the parameter values from the HTML forms by using the

method getParameter().

Send the response to the client by using the method of

PrintWriter class.
3. 4. 5.

Compile the java source code (server.java). Run the HTML program (client.html). Submit the form data to the server.

PROGRAM: client.html <html> <head> <title>Invoking Servlet From HTML</title> </head> <body> <form <fieldset> <legend>Login</legend> <table> <tr> <td>E-mail:</td> <td><input </tr> <td>Password:</td> <td><input </tr> <tr> <td><input </tr> </table> </fieldset> </form> </body> </html> type="submit" Value="Login"></td> type="password" name="Password" size="25"></td> type="text" name="LoginID" size="25"/></td> name="form1" method="post" action="http://localhost:8080/servlets-examples/servlet/server">

server.java import java.io.*; import java.util.*; import javax.servlet.*; public class server extends GenericServlet { public { PrintWriter pw=res.getWriter(); pw.print("<h2>Logged in Successfully...</h2>"); pw.print("<h3><u>Login Details</u></h3>"); Enumeration e=req.getParameterNames(); while(e.hasMoreElements()) { String str1=(String)e.nextElement(); String str2=req.getParameter(str1); pw.print(str1+"="+str2+"<br/>"); } pw.close(); } } void service(ServletRequest req,ServletResponse res)throws ServletException,IOException

6) INVOKING SERVLETS FROM APPLETS

AIM: To write a java applet program that invokes servlet. ALGORITHM:

1.

Write a java applet program (AppletClient.java) with the

following:

Define the class AppletClient which extends the property of the

class Applet and implements the interface ActionListener.

Define the objects for Button and add the button in the init()

method of Applet class.

Make the button to listen the action by using the method

addActionListener().

Set the URL of the servlet program by using the object of the

class URL.

Define the object for AppletContext and display the response

from the server using the method showDocument().

2.

Create an HTML file (AppletClient.html) that contains the applet

tag and pass the class name to that applet code.

3.

Write a simple servlet program (MyServer.java) that contains

any response message.

4.

Run the HTML file (AppletClient.html) that contains the

corresponding applet code.

5.

Click the button on the applet window in order to invoke the

servlet program.

PROGRAM: AppletClient.java import java.io.*; import java.net.*; import java.applet.*; import java.awt.*; import java.awt.event.*; public class AppletClient extends Applet implements ActionListener { public void init() { Button b1=new Button("Click Here to Access Date Information from Server"); b1.setBackground(Color.black); b1.setForeground(Color.red); add(b1); b1.addActionListener(this); } public void actionPerformed(ActionEvent ae) { try { AppletContext ac=getAppletContext(); URL u=new URL("http://localhost:8080/servletsexamples/servlet/MyServer"); ac.showDocument(u); } catch(Exception e) {

System.out.println(e); } } } AppletClient.html <html> <head> <title>Invoking Servlets From Applet</title> </head> <body> <applet code="AppletClient.class" width="300" height="100"> </applet> </body> </html> 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("<h3>Current Date and Time From Server:</h3>"); pw.println("<b>"+d+"</b>"); }}

7) ONLINE EXAMINATION USING JSP AIM: To create a three tier application for conducting online examination using JSP and database. ALGORITHM:
1.

Design the HTML page (ExamClient.html) with the following Create a form to get the input from the user. Use radio buttons to make various options for the questions. Set the URL of the server (ExamServer.jsp) as the value of the

action attribute.

Use submit button to invoke the server and send the form data

to the server.
2.

Create the JSP file with the following Read the input from the client. Retrieve the answers from the database. Match the answers with the correct answers are available inthe

database table.

For each correct answer increment the mark by 5. Server displays the mark and result to the client as a response.

PROGRAM: ExamClient.html <html> <head> <title>Online Exam Client</title> <style type="text/css"> body{background-color:black;font-family:courier;color:blue} </style> </head> <body> <h2 style="text-align:center">ONLINE EXAMINATION</h2> <h3>Answer the following questions (5 marks for each correct answer)</h3> <hr/> <form name="examForm" method="post" action="ExamServer.jsp"> 1.Who is called as the father of computer?<br/> <input type="radio" name="ans1" value="Sachin">Sachin <input type="radio" name="ans1" value="Stuart">Stuart <input type="radio" name="ans1" value="Charles Babbage">Charles Babbage <input type="radio" name="ans1" value="Napier">Napier <br/><br/> 2.C++ was developed by?<br/> <input type="radio" name="ans2" value="Dennis Ritchie">Dennis Ritchie <input type="radio" name="ans2" value="None">None <input type="radio" name="ans2" value="David Ritchie">David Ritchie <input type="radio" name="ans2" value="John">John <br/><br/>

3.C was developed by?<br/> <input type="radio" name="ans3" value="Dennis Ritchie">Dennis Ritchie <input type="radio" name="ans3" value="Stroustrup">Stroustrup <input type="radio" name="ans3" value="David Ritchie">David Ritchie <input type="radio" name="ans3" value="Charles Babbage">Charles Babbage <br/><br/> <input type="submit" value="Check Your Result"/> </form> </body> </html> ExamServer.jsp <%@page contentType="text/html" language="java" import="java.sql.*"%> <html> <head> <title>Online Exam Server</title> <style type="text/css"> body{background-color:black;font-family:courier;color:blue} </style> </head> <body> <h2 style="text-align:center">ONLINE EXAMINATION</h2> <p> <a href="ExamClient.html">Back To Main Page</a> </p> <hr/> <%

String str1=request.getParameter("ans1"); String str2=request.getParameter("ans2"); String str3=request.getParameter("ans3"); int mark=0; Class.forName("sun.jdbc.odbc.JdbcOdbcDriver"); Connection con=DriverManager.getConnection("jdbc:odbc:examDS"); Statement stmt=con.createStatement(); ResultSet rs=stmt.executeQuery("SELECT * FROM examTab"); int i=1; while(rs.next()) { if(i==1) { String dbans1=rs.getString(1); if(str1.equals(dbans1)) { mark=mark+5; } } if(i==2) { String dbans2=rs.getString(1); if(str2.equals(dbans2)) { mark=mark+5; } } if(i==3) {

String dbans3=rs.getString(1); if(str3.equals(dbans3)) { mark=mark+5; } } i++; } if(mark>=10) { out.println("<h4>Your Mark Is : "+mark+"</h4>"); out.println("<h3>Congratulations....! You Are Eligible For The Next Round...</h3>"); } else { out.println("<h4>Your Mark is : "+mark+"</h4>"); out.println("<h3>Sorry....!! You Are Not Eligible For The Next Round...</h3>"); } %> </body> </html>

Database Name: examDB.accdb Table Name: examTab

8) DISPLAYING STUDENT MARK LIST USING JSP AIM: To create a three tier application for displaying student mark list using JSP and database. ALGORITHM:
1.

Design the HTML page (stud.html) with the following Create a form to get the input (Register Number) from the user. Set the URL of the server (marklist.jsp) as the value of the

action attribute.

Use submit button to invoke the server and send the form data

to the server.
2.

Create the JSP file with the following Read the parameter value (Register Number) from the form by

using the method getParameter().

Retrieves the details from the database table with respect to the

form input.

Displays the mark list to the client as the response.

PROGRAM: stud.html <html> <head> <title>Three Tier Application</title> <style type="text/css"> body{color:blue;font-family:courier;text-align:center} </style> </head> <body> <h2>EXAMINATION RESULT</h2><hr/> <form name="f1" method="get" action="marklist.jsp"> Enter Your Reg.No: <input type="text" name="regno"/><br/><br/> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp; <input type="submit" value="SUBMIT"/> </form> </body> <html> marklist.jsp <%@ page contentType="text/html" language="java" import="java.sql.*"%> <html> <head> <title>Three Tier Application</title>

<style type="text/css"> body{color:blue;font-family:courier;text-align:center} </style> </head> <body> <h2>EXAMINATION RESULT</h2><hr/> <% String str=request.getParameter("regno"); Class.forName("sun.jdbc.odbc.JdbcOdbcDriver"); Connection con=DriverManager.getConnection("jdbc:odbc:markDS"); Statement stmt=con.createStatement(); ResultSet rs=stmt.executeQuery("SELECT*FROM markTab WHERE rno="+str); while(rs.next()) { %> Register No:<%=rs.getObject(1)%><br/> Name:<%=rs.getObject(2)%><br/> <table border="1"> <th>SUBJECT</th><th>Mark</th> <tr><td>Artificial Intelligence</td><td><%=rs.getObject(3)%></td></tr> <tr><td>Object Oriented Analysis and Design</td><td><%=rs.getObject(4)%></td></tr> <tr><td>Advanced Computer Architecture</td><td><%=rs.getObject(5)%></td></tr> <tr><td>Principles of Compiler Design</td><td><%=rs.getObject(6)%></td></tr> <tr><td>Web Technology</td><td><%=rs.getObject(7)%></td></tr>

<tr><td>Unix Internals</td><td><%=rs.getObject(8)%></td></tr> </table> <% } %> <br/> <a href="stud.html">Back</a> </body> </html>

9) DISPLAYING STUDENT DETAILS USING XML AND XSLT AIM: To write the programs using XML and XSLT for displaying student details. ALGORITHM:
1.

Create an XML document (stud.xml) that contains the markup

tags such as <name>, <dept>, and <rno>.

2.

Create an XSL document (stud.xsl) that defines the style to

display an XML document.

3.

Associate style sheet (XSL) with XML using the markup <?xml-

stylesheet>
4.

Load the XML document (stud.xml) in the browser.

PROGRAM: stud.xml <?xml version="1.0" encoding="UTF-8"?> <?xml-stylesheet type="text/xsl" href="stud.xsl"?> <studInfo> <stud> <name>Name1</name> <dept>CSE</dept> <rno>97709104001</rno> </stud> <stud> <name>Name2</name> <dept>CSE</dept> <rno>97709104002</rno> </stud> <stud> <name>Name3</name> <dept>CSE</dept> <rno>97709104003</rno> </stud> </studInfo>

stud.xsl <?xml version="1.0" encoding="UTF-8"?> <xsl:transform version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">

<xsl:template match="/"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Student Details - Transformation</title> </head> <body> <table border="1"> <caption>Student Details</caption> <tr> <th>Name</th><th>Department</th><th>Register No</th> </tr> <xsl:for-each select="/studInfo/stud"> <tr> <td><xsl:value-of select="name"/></td> <td><xsl:value-of select="dept"/></td> <td><xsl:value-of select="rno"/></td> </tr> </xsl:for-each> </table> </body> </html> </xsl:template> </xsl:transform>

10) DISPLAYING RANKING DETAILS USING XML AND XSLT AIM: To write the programs using XML and XSLT for displaying player ranking details. ALGORITHM:
1.

Create an XML document (rank.xml) that contains the markup

tags such as <rank>, <name>, and <country>.

2.

Create an XSL document (rank.xsl) that defines the style to

display an XML document.

3.

Associate style sheet (XSL) with XML using the markup <?xml-

stylesheet>
4.

Load the XML document (rank.xml) in the browser.

PROGRAM: rank.xml <?xml version="1.0" encoding="UTF-8"?> <?xml-stylesheet type="text/xsl" href="rank.xsl"?> <rankInfo> <player> <rank>1</rank> <name>H.M.Amla</name> <country>SA</country> </player> <player> <rank>2</rank> <name>A.B.De Villiers</name>

<country>SA</country> </player> <player> <rank>3</rank> <name>V.Kohli</name> <country>IND</country> </player> <player> <rank>4</rank> <name>K.C.Sangakkara</name> <country>SL</country> </player> <player> <rank>5</rank> <name>M.S.Dhoni</name> <country>IND</country> </player> </rankInfo>

rank.xsl <?xml version="1.0" encoding="UTF-8"?> <xsl:transform version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"> <xsl:template match="/"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Student Details - Transformation</title> </head> <body> <table border="1"> <caption>ICC Player Rankings</caption> <tr> <th>Rank</th><th>Name</th><th>Country</th> </tr> <xsl:for-each select="/rankInfo/player"> <tr> <td><xsl:value-of select="rank"/></td> <td><xsl:value-of select="name"/></td> <td><xsl:value-of select="country"/></td> </tr> </xsl:for-each> </table> </body> </html> </xsl:template> </xsl:transform>

11) DISPLAYING CRICKET PLAYERS PROFILE USING AJAX AIM: To write a program using AJAX for displaying cricket players profile. ALGORITHM:
1.

Create an XHTML document (AjaxDemo.html) with the following. Insert some images of cricket players. Call the function getContent() with respect to the onmouseover

event. The function accepts an argument that is the URL of another page contains the information about the player.

Call the function clearContent() with respect to the onmouseout

event.
2.

Within this XHTML document, insert AJAX based JavaScript code

with the following.

Create the object for ActiveXObject (for older versions of

browsers such as IE5 and IE6).

Create the object for XMLHttpRequest (for modern browsers

such as IE7+, Firefox, Chrome, Safari, and Opera).

AJAX send the request with the use of send() and open()

methods.

Receive the response with the use of responseText Property. AJAX Call the function diplayProfile() with respect to the event

onreadystatechange.

PROGRAM: AjaxDemo.html <html> <head> <title>Ajax Demo...</title> <style type="text/css"> .box{border:1px solid blue;padding:10px} </style> <script type="text/javascript"> var req; function getContent(url) { if(window.ActiveXObject) { req=new ActiveXObject("Microsoft.XMLHTTP"); } else if(window.XMLHttpRequest) { req=new XMLHttpRequest(); } req.onreadystatechange=diplayProfile; req.open('POST',url,true); req.send(null); } function diplayProfile() { if(req.readyState==4) { document.getElementById('contentArea').innerHTML=req.responseText;

} } function clearContent() { document.getElementById('contentArea').innerHTML=''; } </script> </head> <body bgcolor="cyan"> <h1>Mouse over the image for More Information</h1> <img src="sachin.jpg" height="95" width="80" onmouseover='getContent("sachin.html")' onmouseout='clearContent()'/> <img src="dravid.jpg" height="95" width="80" onmouseover='getContent("dravid.html")' onmouseout='clearContent()'/> <img src="kohli.jpg" height="95" width="80" onmouseover='getContent("kohli.html")' onmouseout='clearContent()'/> <img src="raina.jpg" height="95" width="80" onmouseover='getContent("raina.html")' onmouseout='clearContent()'/> <img src="yuvi.jpg" height="95" width="80" onmouseover='getContent("yuvi.html")' onmouseout='clearContent()'/> <img src="veeru.jpg" height="95" width="80" onmouseover='getContent("veeru.html")' onmouseout='clearContent()'/> <img src="dhoni.jpg" height="95" width="80" onmouseover='getContent("dhoni.html")' onmouseout='clearContent()'/> <div class="box" id="contentArea"/> </body> </html>

sachin.html <html> <body> <b>Full name:</b> Sachin Ramesh Tendulkar<br/><br/> <b>Born:</b> April 24, 1973, Bombay (now Mumbai), Maharashtra<br/><br/> <b>Major teams:</b> India, Asia XI, Mumbai, Mumbai Indians, Yorkshire<br/><br/> <b>Nickname:</b> Tendlya, Little Master<br/><br/> <b>Playing role:</b> Top-order batsman<br/><br/> <b>Batting style:</b> Right-hand bat<br/><br/> <b>Bowling style:</b> Right-arm offbreak, Legbreak googly </body></html> dravid.html <html> <body> <b>Full name:</b> Rahul Sharad Dravid<br/><br/> <b>Born:</b> January 11, 1973, Indore, Madhya Pradesh <br/><br/> <b>Major teams:</b> India, Scotland, Asia XI, ICC World XI, Karnataka, Kent, Marylebone Cricket Club, Rajasthan Royals, Royal Challengers Bangalore<br/><br/> <b>Nickname:</b> The Wall<br/><br/> <b>Playing role:</b> Top-order batsman<br/><br/> <b>Batting style:</b> Right-hand bat<br/><br/> <b>Bowling style:</b> Right-arm offbreak </body>

</html> kohli.html <html> <body> <b>Full name:</b> Virat Kohli<br/><br/> <b>Born:</b>November 5, 1988, Delhi<br/><br/> <b>Major teams:</b>India, Delhi, India Red, India Under-19s, Royal Challengers Bangalore<br/><br/> <b>Playing role:</b>Middle-order batsman<br/><br/> <b>Batting style:</b>Right-hand bat<br/><br/> <b>Bowling style:</b>Right-arm medium </body> </html> raina.html <html> <body> <b>Full name:</b> Suresh Kumar Raina<br/><br/> <b>Born:</b>November 27, 1986, Muradnagar, Ghaziabad, Uttar Pradesh<br/><br/> <b>Major teams:</b>India, Chennai Super Kings, India Blue, India Under19s, Indian Board President's XI, Rajasthan Cricket Association President's XI, Uttar Pradesh, Uttar Pradesh Under-16s<br/><br/> <b>Playing role:</b>Middle-order batsman<br/><br/> <b>Batting style:</b>Left-hand bat<br/><br/> <b>Bowling style:</b> Right-arm offbreak </body>

</html> yuvi.html <html> <body> <b>Full name:</b>Yuvraj Singh<br/><br/> <b>Born:</b>December 12, 1981, Chandigarh<br/><br/> <b>Major teams:</b>India, Asia XI, Kings XI Punjab, Pune Warriors, Punjab, Yorkshire<br/><br/> <b>Playing role:</b>Middle-order batsman<br/><br/> <b>Batting style:</b>Left-hand bat<br/><br/> <b>Bowling style:</b>Slow left-arm orthodox </body> </html> veeru.html <html> <body> <b>Full name:</b>Virender Sehwag<br/><br/> <b>Born:</b>October 20, 1978, Delhi<br/><br/> <b>Major teams:</b>India, Asia XI, Delhi, Delhi Daredevils, ICC World XI, India Blue, Leicestershire, Rajasthan Cricket Association President's XI<br/><br/> <b>Playing role:</b>Top-order batsman<br/><br/> <b>Batting style:</b>Right-hand bat<br/><br/> <b>Bowling style:</b>Right-arm offbreak </body> </html>

dhoni.html <html> <body bgcolor="cyan"> <b>Full name:</b> Mahendra Singh Dhoni<br/><br/> <b>Born:</b>July 7, 1981, Ranchi, Bihar (now Jharkhand)<br/><br/> <b>Major teams:</b>India, Asia XI, Bihar, Chennai Super Kings, Jharkhand<br/><br/> <b>Playing role:</b>Wicketkeeper batsman<br/><br/> <b>Batting style:</b>Right-hand bat<br/><br/> <b>Bowling style:</b>Right-arm medium </body> </html>