Wednesday 8 May 2013

INTERNET PROGRAMMING LABORATORY MANUAL

Ex.No:1        WEB DESIGN FOR TOURISM INFORMATION SYSTEM

Aim:
To create a tourism website using DHTML

Solution:
Step 1:
    Create home.html to split the webpage and specify the source page to be displayed at left frame and main frame.

home.html

<?xml version="1"?>
<!DOCTYPE html PUBLIC "-//w3c//DTD XHTML1.0 frameset//EN"   
    "http://www.w3.org/TR/xhtml/DTD/xhtml1/frameset.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> FRAMES </title>
<frameset cols="300,*">
<frame name="leftframe" src="citymap.html"/>
<frameset rows="">
<frame name="mainframe" src="image.html">
</frameset>
</head>
<noframe>
     <body>
<p> FRAME SET NOT SUPPOURTING</p>
     </body>
</noframe>
</html>




Step 2:
    Create image.html to display the location images of the tour spots in the home page.

image.html

<?xml version="1"?>
<!DOCTYPE html PUBLIC "-//w3c//DTD XHTML1.0//EN"   
    "http://www.w3.org/TR/xhtml/DTD/xhtml1.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> places </title>
</head>
<body background="wallpaper.jpg">
<marquee>
<b><h1>Welcome To Coimbatore!!!</h1><b></marquee>
<marquee>
<img src="wall.bmp"/>
</marquee>
 </body>
</html>

Step 3:
    Create  about.html which shows the information about the tourist spot.

about.tml

<?xml version="1"?>
<!DOCTYPE html PUBLIC "-//w3c//DTD XHTML1.0//EN"   
    "http://www.w3.org/TR/xhtml/DTD/xhtml1.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> FRAMES </title>
</head>
<body>
<marquee> Welcome to Coimbatore  </marquee>
<img src=coimbatore.JPG height="300" width="1000"/>
<pre>
Coimbatore is the third largest city in Tamilnadu, With a population of more than 15 lakhs. There are more than 30,000 tiny small, medium and large industries and textile mills.
The city is known for its entrepreneurship of its residents. The climate is comfortable round the year.The city is situated on the banks of the river Noyyal. Coimbatore existed
</body>
</html>

Step 4:
    Create a place.html to display the spots available in the tourist place with all the details about that place.

place.html

<?xml version="1"?>
<!DOCTYPE html PUBLIC "-//w3c//DTD XHTML1.0//EN"   
    "http://www.w3.org/TR/xhtml/DTD/xhtml1.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> places </title>
</head>
<body>
<pre>
<img src=churches.JPG height="200" width="1000"/>
<b> BLACK THUNDER </B>
<p>
<img src=black_thunder.JPG />
<pre>
<p>    Black Thunder is the Asia's Number 1 theme park, which is built to entertain and cherish the people.<p> The theme park is nuzzled with outstanding natural
and scenic beauty along with the greeny hills of Nilgiris and a chill covering of trees.
     <b> Infant Jesus Church </B>
<img src=churches.JPG height="150" width="150" />
Infant Jesus Church is one of the most familiar churches located in Kovaipudur, Coimbatore city, Tamil Nadu. Due to the increased growth of the catholic families, a small church was set straight with the blessings of almighty in the year 1984.
</body>
</html>

Step 5:
    Create hotel.html to display the places for boarding and lodging in the tourist locations.

hotel.html

<?xml version="1"?>
<!DOCTYPE html PUBLIC "-//w3c//DTD XHTML1.0//EN"   
    "http://www.w3.org/TR/xhtml/DTD/xhtml1.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> places </title>
</head>
<body>
<img src=hotel.JPG height="300" width="1000"/>
<pre>
<b> Sree Annapoorna Lodging ( 3 Star Hotel ) </b>
Address: 75, East Arockiasany Road, R.S. Puram, , Coimbatore
Location: City Center
Property Type: Business And Leisure Hotel
Sree Annapoorna Lodging is located in the heart of the city, 10 km from Airport and 3 Km from the Railway Station.
The hotel offers every modern comfort to make your stay pleasant and memorable.
Accessibility: Airport: 10KM., Bus Station: 3KM., Railway Station: 3KM.

--------------------------------------------------------------------------------
<b>The Residency ( 3 Star Hotel ) </b>
Address: Avinashi Road, , Coimbatore
Location: City Center
Property Type: Business And Leisure Hotel
</pre>
</body>
</html>


















OUTPUT

HOME PAGE










ABOUT COIMBATORE











TOURIST SPOTS











ABOUT BOARDING AND LODGING








Result:

    Thus the DHTML based website for Tourism Information system was created successfully.

Ex.No:2            LIBRARY INFORMATION SYSTEM

Aim:
To create an online portal for distributed library information system using java script

Solution:
Step 1:
    Create a database of library books in Microsoft access save it as the name of db1.mdb.The table is created inside the database is tb1.

Step 2:
    Store some information in the created database.

Step 3:
    Now the javascript which will get connected with the above database and execute the required information is as follows.

Coding:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional //EN"
"http://WWW.W3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<script type="text/javascript">
<!--
var adOpenDynamic=2;
var adLockOptimistic=3;
var strDbPath="C:\\Documents and Settings\\user\\Desktop\\ip\\ex3\\db1.mdb";
var conn_str="Provider=Microsoft.Jet.OLEDB.4.0;Data Source="+strDbPath;
function getAdoDb(strAdoType)
{
if(window.ActiveXObject)
{
       return new ActiveXObject(strAdoType);
}
else
{
          return ActiveXObject(strAdoType);
}
}
function searchReports()
{
try
{
var s=document.getElementById("mytxt").value;
var strHtml="";
strHtml+="<table cellpadding=0 cellspacing=0 border=1 width=500px align=center >";
strHtml+="<tr><td align=center colspan=4><b>Stock List</b></td></tr>";
strHtml+="<tr><td>BOOKID</td><td>TITLE</td><td>AUTHOR</td><td>AVAILABILITY</td></tr>";
//Database Connection

var conn=getAdoDb("ADODB.Connection");
conn.open(conn_str,"","");
//Recordset
var rs=new ActiveXObject("ADODB.Recordset");

//var s="Internetprogramming";
strQuery="SELECT BOOkID,TITLE,AUTHOR,AVAILABILITY FROM tb1 where TITLE="+"'"+s+"'";
rs.open(strQuery,conn,adOpenDynamic,adLockOptimistic);
if(!rs.bof)
{
         rs.MoveFirst();
         while(!rs.eof)
         {
strHtml+="<tr>";
strHtml+="<td width=\"10px\">"+rs.fields(0).value+"</td>";
strHtml+="<td width=\"50px\">"+rs.fields(1).value+"</td>";
strHtml+="<td width=\"10px\">"+rs.fields(2).value+"</td>";
strHtml+="<td width=\"5px\">"+rs.fields(3).value+"</td>";
strHtml+="</tr>";
rs.MoveNext();
       }
}
else
{
//No Records.
strHtml+="<tr colspan=4><td align=center><font color=red>No Records</font></td></tr>";
}
conn.close();
strHtml+="</table>";
strHtml+="<a href='C:\\Documents and Settings\\user\\Desktop\\ip\\ex3\\ex3.html'>Back</a>";
document.write(strHtml);
}
catch(ex)
{
alert(ex.message);
}
}
//-->
</script>
<title>LIBRARY INFORMATION SYSTEM</title>
</head>
 <body>
<h1>LIBRARY INFORMATION SYSTEM</h1>
<form>
            <center><h4>Enter the name of the Subject to be searched in the library</h4>
     <table>
             <tr><td><input type="text"id="mytxt" value=""/></td>
<td><input type="button" value="search" onClick = "searchReports();"/></td></tr>
     </table>
             </center>
         </form>
 </body>
</html>
.
OUTPUT:
LIBRARY INFORNATION SYSTEM
Enter the name of the subject to be searched in the labrary




stock List
BookId     Title     Author     Availability
101    dbms    aaa    2
BACK







Libtable
ID    BookId    Title    Author    Availability
1    101    dbms    aaa    2
2    102    os    bbb    3
3    103    ip    ccc    4
    



















Result:
    Thus an online portal for distributed library information system using javascript was executed successfully
 




Ex.No:3        EMPLOYEE INFORMATION SYSTEM USING SERVLETS

AIM:
    To design a servlet for Employee  Information system for Employee Information system using java database connectivity.

PROCEDURE:

Step 1:
    Create an employee database using MSACCESS.
Step 2:
    Create a DSN connection for created db.
Control panel -> open administrative tools -> data source(ODBC).
Step 3:
    Connect the database to the created DSN.
Step 4:
    Now the DSN connection is ready.create the following programs.

GUI INTERFACE:

<html>
      <head>
           <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
           <title>JSP Page</title>
      </head
<body>
        <center>
          <h4>
              Select the Department for Employee information
          </h4>
<form name="form1" method="get"                action="http://localhost:8084/WebApplication6/empservlet">
              <select name="DeptName" size="1">
                  <option value="cse">cse</option>
                  <option value="ece">ece</option>
                  <option value="eee">eee</option>
                  <option value="mech">IT</option>
              </select>
              <br/><br/>
              <input type="submit" value="submit">
          </form>
      </center>
  </body>
    </body>
</html>

Servlet program
/*
 * To change this template, choose Tools | Templates
 * and open the template in the editor.
 */

import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.util.*;
import javax.sql.*;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.sql.Statement;

/**
 *
 * @author user
 */
public class empservlet extends HttpServlet {
  
    /**
     * Processes requests for both HTTP <code>GET</code> and <code>POST</code> methods.
     * @param request servlet request
     * @param response servlet response
     * @throws ServletException if a servlet-specific error occurs
     * @throws IOException if an I/O error occurs
     */
    protected void processRequest(HttpServletRequest request, HttpServletResponse response)
    throws ServletException, IOException {
        response.setContentType("text/html;charset=UTF-8");
        PrintWriter out = response.getWriter();
        try {
            /* TODO output your page here
            out.println("<html>");
            out.println("<head>");
            out.println("<title>Servlet empservlet</title>"); 
            out.println("</head>");
            out.println("<body>");
            out.println("<h1>Servlet empservlet at " + request.getContextPath () + "</h1>");
            out.println("</body>");
            out.println("</html>");
            */
        } finally {
            out.close();
        }
    }
    // <editor-fold defaultstate="collapsed" desc="HttpServlet methods. Click on the + sign on the left to edit the code.">
    /**
     * Handles the HTTP <code>GET</code> method.
     * @param request servlet request
     * @param response servlet response
     * @throws ServletException if a servlet-specific error occurs
     * @throws IOException if an I/O error occurs
     */
    @Override
    public void doGet(HttpServletRequest request, HttpServletResponse response)
    throws ServletException, IOException {
        Connection con=null;
        Statement stmt=null;
        ResultSet rs=null;
        String dname=request.getParameter("DeptName");
        response.setContentType("text/html;charset=UTF-8");
        PrintWriter out = response.getWriter();
        try {
            Class.forName("sun.jdbc.odbc.JdbcOdbcDriver");
            con=DriverManager.getConnection("jdbc:odbc:emp","","");
        }
        catch(ClassNotFoundException e)
        {
            e.printStackTrace();
        }
        catch(SQLException e)
        {
            e.printStackTrace();
        }
        catch(Exception e)
        {
            e.printStackTrace();
        }
        try
        {

            out.println("<html>");
            out.println("<head>");
            out.println("<title>EMPLOYEE INFORMATION  SYSTEM</title>");
            out.println("</head>");
            out.println("<body><center>");
            out.println("<h1>Employee Details</h1>");
            out.println("<table border=3>");
            out.println("<th>EmpNo</th>");
            out.println("<th>Name</th>");
            out.println("<th>Dept</th>");
            out.println("<th>Salary</th>");
            stmt=con.createStatement();
            rs=stmt.executeQuery("SELECT * FROM emptable WHERE dept='"+dname+"'");
           while(rs.next())
           {
               out.println("<tr>");
               out.println("<td>");
               out.println(rs.getObject(1).toString());
               out.println("</td>");
              out.println("<td>");
               out.println(rs.getObject(2).toString());
               out.println("</td>");
              out.println("<td>");
               out.println(rs.getObject(3).toString());
               out.println("</td>");
               out.println("<td>");
               out.println(rs.getObject(4).toString());
               out.println("</td>");
              out.println("</tr>");
           }
            out.println("<table>");
            out.println("</center>");
            out.println("</body>");
            out.println("</html>");
             }
        catch(SQLException e)
        {
        }
         finally {
             try
             {
                 if(rs!=null)
                 {
                     rs.close();
                     rs=null;
                 }
                 if(stmt!=null)
                 {
                     stmt.close();
                     stmt=null;
                 }
                 if(con!=null)
                 {
                     con.close();
                     con=null;
                 }
            }catch(SQLException e)
             {
            }
        }
         out.close();
                 }
             }         
    /**
     * Handles the HTTP <code>POST</code> method.
     * @param request servlet request
     * @param response servlet response
     * @throws ServletException if a servlet-specific error occurs
     * @throws IOException if an I/O error occurs
     */
    @Override
    protected void doPost(HttpServletRequest request, HttpServletResponse response)
    throws ServletException, IOException {
        processRequest(request, response);
    }

    /**
     * Returns a short description of the servlet.
     * @return a String containing servlet description
     */
    @Override
    public String getServletInfo() {
        return "Short description";
    }// </editor-fold>

}

Step 5:
    Debug the programs.

Step 6:
Run the programs.





OUTPUT:



RESULT:

    Thus the servlet program using JDBC (3 tier Architecture)  has been created and executed successfully.

Ex.No:4        INSTANT MESSENGER USING SOCKET PROGRAMMING

Aim:
To design an instant messanger with file transfer and message transfer facility using thread and applet.

Algorithm:
Step 1: Create a server Application using socket program.
Step 2: Create a client Application using socket program.
Step 3: Execute server application (server listener portof client connectd).
Step 4: Execute Client application.

Program:

Server:
import java.awt.*;
import java.awt.event.*;
import java.net.*;
import java.io.*;
public class server extends Frame implements ActionListener,Runnable
{
ServerSocket ss;
Socket s;
BufferedReader br;
BufferedWriter bw;
TextField text;
Button sendBut,exitBut;
List list;
public server(String m)
{
super(m);
setSize(300,130);setLocation(0,0);
setResizable(false);
setBackground(new Color(192,192,192));
this.setLayout(new GridLayout(2,1));
Panel panels[]=new Panel[2];
panels[0]=new Panel();
panels[1]=new Panel();
panels[0].setLayout(new BorderLayout());
panels[1].setLayout(new FlowLayout(FlowLayout.LEFT));
sendBut=new Button("send");
exitBut=new Button("Exit");
sendBut.addActionListener(this);
exitBut.addActionListener(this);
list=new List();
list.addItem("Server up and Listening on port plz wait");
text=new TextField(25);
panels[0].add(list);
panels[1].add(text);
panels[1].add(sendBut);
panels[1].add(exitBut);
add(panels[0]);
add(panels[1]);
setVisible(true);
try
{
ss=new ServerSocket(1053);
s=ss.accept();
br=new BufferedReader(new InputStreamReader(s.getInputStream()));
bw=new BufferedWriter(new OutputStreamWriter(s.getOutputStream()));
bw.write("hai how are u");
bw.newLine();
bw.flush();
Thread th;
th=new Thread(this);
th.start();
}
catch(Exception e)
{}}
public void run()
{
while(true)
{
try
{
list.addItem(br.readLine());
}
catch(Exception e)
{}
}}
public static void main(String args[])
{
new server("Server Application");
}
public void actionPerformed(ActionEvent ae)
{
if(ae.getSource().equals(exitBut))
System.exit(0);
else
{
try
{
bw.write(text.getText());
bw.newLine();
bw.flush();
text.setText("");
}
catch(Exception x)
{}}}
}


Client program:

import java.awt.*;
import java.awt.event.*;
import java.net.*;
import java.io.*;
public class client extends Frame implements ActionListener,Runnable
{
Socket s;
BufferedReader br;BufferedWriter bw;
TextField text;Button sendBut,exitBut;
List list;
public client(String st)
{
super(st);
setSize(300,130);
setLocation(300,0);
setResizable(false);
setBackground(new Color(192,192,192));
this.setLayout(new GridLayout(2,1));
Panel panels[]=new Panel[2];
panels[0]=new Panel();
panels[1]=new Panel();
panels[0].setLayout(new BorderLayout());
panels[1].setLayout(new FlowLayout(FlowLayout.LEFT));
sendBut=new Button("send");
exitBut=new Button("Exit");
sendBut.addActionListener(this);
exitBut.addActionListener(this);
list=new List();
list.addItem("Server up and Listening on port plz wait");
text=new TextField(25);
panels[0].add(list);
panels[1].add(text);
panels[1].add(sendBut);
panels[1].add(exitBut);
add(panels[0]);
add(panels[1]);
setVisible(true);
try
{s=new Socket("localhost",1053);
br=new BufferedReader(new InputStreamReader(s.getInputStream()));
bw=new BufferedWriter(new OutputStreamWriter(s.getOutputStream()));
Thread th;
th=new Thread(this);
th.start();
}
catch(Exception e)
{}
}
public void run()
{
while(true)
{try
{list.addItem(br.readLine());
}catch(Exception h)
{}}}
public static void main(String args[])
{
new client("client Application");
}
public void actionPerformed(ActionEvent ae)
{
if(ae.getSource().equals(exitBut))
System.exit(0);
else
{try
{
bw.write(text.getText());
bw.newLine();
bw.flush();
text.setText("");
}
catch(Exception m)
{}}}
}
      
OUTPUT:

SERVER:








CLIENT:












Result:
Thus the Instant messenger is created and executed successfully by using Socket programming.



Ex.No:5        IMAGE MAPPING USING HTML

AIM
To write the html code to perform the Image Mapping

ALGORITHM
Step 1: Start.
Step 2: Write the code for imagemap.html.
Step 3: Perform mapping using <MAP> tag.
Step 4: Insert Hyperlink using <A href>.
Step 5: Display Results.
Step 6: Stop.

PROGRAM:

program.html

<html>
<head>
<title>netherlands</title>
</head>
<body bgcolor="black">
<p align="Center">
</p>
<map name="netherlands">
<area href="C:\gro.html" shape="circle" coords="362,56,10">
<area href="C:\fry.html" shape="circle" coords="278,67,10">
<area href="C:\lim.html" shape="circle" coords="317,408,10">
<area href="C:\hol.html" shape="circle" coords="149,291,10">
</map>
<img src="C:\nether.gif"
usemap="# netherlands">
</body>
</html>

fry.html
<html>
<head>
<title>friesland</title>
</head>
<body>
<img src="fry.gif">
A flag with pompeblêdden (lily leaves) was already mentioned in the "Gudrunlie d" from the 11th century. This was also used by the Ommelanden. Since the middle of the 19th ce ntury the flag is used by the Fryske Biweging, and was accepted by the Deputed States (Provincial Legislature) in 1897. During the festivities of the 40th and 50th re igning jubilee of Queen Wilhelmina in 1938 and 1948 it was used by each municipality with the municipal arms in the canton. Finally it was officially adopted 9 July 1957 by the States of Friesland, nr. 12 Prov./besluit 20. The provincial paper, 1958, nr. 12, gives de tailed construction sheets.
</body>
</html>


gro.html
<html>
<head>
<title> groningen</title>
</head>
<body>
<img src="C:\gro.gif">
Originally a part of Frisia, Groninge n became a part of the Frankish Empire around 785. Charlemagne assigned the  Christianization of this new possession to Ludger. In the 11th century, the city of Groningen was a village in Drenthe that belonged to the Bishopric of Utrecht, while most of the province was in the diocese of Münster. During the Middle Ages, central control was remote, and the city of Groningen acted as a city state, exerting a dominating influence on the surrounding Ommelanden. Around 1500, Maximilian I, Holy Roman
</body>
</html>

hol.html
<html>
<head>
<title>zuid holland</title>
</head>
<body>
<img src="hol.gif">
Also spelled  Zuidholland , English  South Holland  provincie, weste rn Netherlands, bordering the North Sea and adjoining the provincies of Noord-Holland (north), Utrecht and Gelderland (east), and Noord-Brabant and Zeeland (south). Drained by the ramifications of the Lek, Waal, and Maas (Meuse) rivers, Zuid-Holland includes the islands of Dordre cht, IJsselmonde, Hoeksche Waard, Voorne-Putten, and Goeree-Overflakkee.
</body>
</html>

lim.html
<html>
<head>
<title>limburg</title>
</head>
<body>
<img src="lim.gif">
A provincial flag consisting of red and white colors has existed long ago, but the Minister of Foreign Affairs sent a le tter on 19 Mar 1883, in which he stated that the Duchy of Limburg was not an independent state and was therefore not entitled to hoist its own flag. For no province of the Realm (and as such Limburg is to be constitutionally considered) is allowed, as part of the Realm, to have another flag than the National flag of the Netherlands...
</body>
</html>
OUTPUT:



















RESULT
Thus image mapping has been performed using HTML.


Ex.No:6        ONLINE EXAMINATION USING JSP

AIM
To write the html code to perform the online examination and produce the report using JSP

ALGORITHM

Step 1: Start.
Step 2: Write the code for online examination.
Step 3: Perform form using <input> tag.
Step 4: Produce the report using jsp.
Step 5: generate the individual result.
Step 6: Display Results.
Step 7: Stop.

PROGRAM:

Home.html

<html>
 <head><title> ONLINE EXAMINATION</title></head>
<frameset rows="25%,*">
<frame src=one.html name=f1>
<frameset cols="15%,*">
<frame src=two.html name=f2>
<frame src=three.html name=f3>
</frameset>
</frameset>
</html>

One.html

<html>
      <body bgcolor="red">
          </br>
          </br>
          <center><b><h1>ONLINE EXAMINATION</b></center>
      </body>
</html>

Two.html

<html>
<body bgcolor="pink">
<a href=add1.html target=f3>Exam</a></br>
<a href=report1.html target=f3>Result Report</a></br>
<a href=report2.html target=f3>Individual Result</a></br>
</body>
</html>

Three.html

<html>
<body bgcolor="pink">
</body>
</html>

Add1.html

<html>
            <body bgcolor="pink"><form action=http://localhost:8080/examples/jsp/add.jsp                 method="post">
<center><U><B>ONLINE EXAMINATION</U></CENTER></B>
<br>
<br>
<b>Seat Number:<input type=text name=seatno><br>
<b>Student Name:<input type=text name=name><br><BR>
<b>1.Every host implementations transport layer</b></br>
<input type="radio" name="group1" value="True">True
<input type="radio" name="group1" value="False">False<br>
<b>2.It is a network layer's responsibility to forward packets reliability from source to destinationr.</b></br>
<input type="radio" name="group2" value="True">True
<input type="radio" name="group2" value="False">False<br>
<b>3.Packet switching is more useful in burstly traffic</b></br>
<input type="radio" name="group3" value="True">True
<input type="radio" name="group3" value="False">False<br>
<b>4.A phone network uses packet switching.</b></br>
<input type="radio" name="group4" value="True">True
<input type="radio" name="group4" value="False">False<br>
<b>5.HTML is a protocol for describing web content.</b></br>
<input type="radio" name="group5" value="True">True
<input type="radio" name="group5" value="False">False<br>
<center><input type=submit value=Submit name=b></td></tr>
</form>
</body>
</html>

Add.jsp

<%@ page import="java.sql.*"%>
<%try
{
int marks,total=0;
String name,ans1,ans2,ans3,ans4,ans5;
Connection con=null;
Class.forName("sun.jdbc.odbc.JdbcOdbcDriver");
String s="jdbc:odbc:student";
con=DriverManager.getConnection(s,"","");
Statement st=con.createStatement();
int sno=Integer.parseInt(request.getParameter("seatno"));
name=request.getParameter("name");
ans1=request.getParameter("group1");
ans2=request.getParameter("group2");
ans3=request.getParameter("group3");
ans4=request.getParameter("group4");
ans5=request.getParameter("group5");
if(ans1.equals("True"))
total+=2;
if(ans2.equals("False"))
total+=2;
if(ans3.equals("True"))
total+=2;
if(ans4.equals("False"))
total+=2;
if(ans5.equals("False"))
total+=2;
st.executeUpdate("insertintostock"+"(seatno,name,marks)values("+sno+",'"+name+"total+);
out.println("<h3>updated.......</h3>");
}
catch(Exception e)
{
out.println(e);
}%>

Report1.html

<html>
<body>
<h2> Online Examination Report of Students</h2>
<form action="http://localhost:8080/examples/jsp/report.jsp" method="post">
<center><input type=submit name=s1 value=Show_Report></center>
</form>
</body>
</html>

Report.jsp

<html>
<body bgcolor="pink">
<%@ page import="java.sql.*"%>
<%
Connection con=null;
Class.forName("sun.jdbc.odbc.JdbcOdbcDriver");
String s="jdbc:odbc:student";
con=DriverManager.getConnection(s,"","");
Statement st=con.createStatement();
ResultSet rs=st.executeQuery("SELECT * FROM stock");
%>
<h1><center>STUDENTS REPORT</center></h1>
<center><table border=1 bgcolor="yellow">
<tr>
<th>SEAT NUMBER</th>
<th>NAME</th>
<th>MARKS</th>
</tr>
<%
while(rs.next())
{
%>
<tr>
<td><%=rs.getInt(1) %></td>
<td><%=rs.getString(2) %></td>
<td><%=rs.getInt(3) %></td>
</tr>
<%
}
%>
</table>
</center>
</body>
</html>
Report2.html

<html>
<body>
<h2> Online Examination Report of Students</h2>
<form action="http://localhost:8080/examples/jsp/report2.jsp" method="post">
<input type=text name=seatno><br>
<center><input type=submit name=s1 value=Show_Report></center>
</form>
</body>
</html>

Report2.jsp
<html>
<body bgcolor="pink">
<%@ page import="java.sql.*"%>
<%
Connection con=null;
Class.forName("sun.jdbc.odbc.JdbcOdbcDriver");
String s="jdbc:odbc:student";
con=DriverManager.getConnection(s,"","");
Statement st=con.createStatement();
int sno=Integer.parseInt(request.getParameter("seatno"));
ResultSet rs=st.executeQuery("SELECT * FROM stock WHERE seatno=" +sno);
%>
<h1><center>INDIVIDUAL STUDENTS REPORT</center></h1>
<%
if(!rs.next())
out.println("<h3> The record is not found.</h3>");
else
{
%>
<center><table border=1 bgcolor="yellow">
<tr>
<th>SEAT NUMBER</th>
<th>NAME</th>
<th>MARKS</th>
</tr>
<%
do
{
%>
<tr>
<td><%=rs.getInt(1) %></td>
<td><%=rs.getString(2) %></td>
<td><%=rs.getInt(3) %></td>
</tr>
<%
}
while(rs.next());
}
%>
</table>
</center>
</body>
</html>








OUTPUT:









































RESULT:
Thus the online examination using jsp was created and executed successfully.


Ex.No:7        XHTML WEB PAGE USING CASCADING STYLE SHEETS

AIM
To write the xhtml page using inline, embedded and external styles.

ALGORITHM

Step 1: Start.
Step 2: Write the web page xhtml code.
Step 3: Write the inline style.
Step 4: Write the embedded style.
Step 5: Write the external style.
Step 6: Display Results.
Step 7: Stop.

PROGRAM:

CSS.HTML:
<html>
<head>
<title>CASCADING STYLE SHEETS</title>
</head>
<body>
<center><h2><u><b>CASCADING STYLE SHEETS<b></u></h2></center>
<h3><p> The key property of style sheet technology is that it can be used to separate the presentation of information from the information content and semantic tagging</p></h3>
<li><a href="inline.html">inline style sheet</a>
<li><a href="embedded.html">embedded style sheet</a>
<li><a href="external.html">external style sheet</a>
</body>
<html>

   
INLINE.HTML:
<html>
<head>
<title>INLINE </title>
<body>
<b><center><u> INLINE STYLE SHEETS</u></center></b>
<p style="font-family:arial;font-size:16;font-color:blue">this is example for</p>
<h1 styles="font-color:blue">INLINE STYLE SHEET</h1>
<p style="font-size: x-large; color: #ff9900">
Inline style sheets is a term that refers to style sheet information being applied to the current element.
</p>
<p style="color:sienna;margin-left:20px">
To use inline styles you use the style attribute in the relevant tag. The style attribute can contain any CSS property. The example shows how to change the color of a paragraph.
</p>
<p style="background:#ccc; color:#fff; border: solid black 1px;">
An inline style loses many of the advantages of style sheets by mixing content with presentation.
</p>
<li><a href="css.html"><center>HOME</center></a>
</head>
</body>
</html>

EMBEDDED.HTML:
<html>
<head>
<title>EMBEDDED</title>
<style type="text/css">
h1{font family:arial;color:red}
p{font size:14pt;color:green; }
.special{color:pink}
</style>
</head>
<body>
<b><center><u>EMBEDDED STYLE SHEETS</u></center></b>
<p class="special">this is example of</p>
<h1 class="special">EMBEDDED STYLE SHEETS</h1>
<h2  class="special">An embedded style controls the appearance of a single document</h2>
<p class="special">In embedded style sheet the style will be specified in the header section of the html document</p>
<h2 class=”special”>The main advantage of using embedded style sheet is it is very easy to edit and troubleshoot the code</h2>
<p>
<li><a href="css.html"><center>HOME</center></a>
</body>
</html>

Style.css

p{font-size:14pt;color:orange}
h1{color:red;background-color:blue}
h2{color:yellow;background-color:blue}h3{color:pink;background-color:blue}

EXTERNAL.HTML:
<html>
<head>
<title><center>EXTERNAL CSS</center></title>
<link rel="stylesheet"type="text/css"href="style.css"/>
</head>
<body>
<b><center><u>EXTERNAL STYLE SHEETS<u></center></b>
<h1>this is example of</h1>
<p>EXTERNAL STYLE SHEET</p><br/>
<h2><p>In the external style sheet the styles are specified in the separate files and linked to the document where the styles are needed using link tag</p><br/></h2>
<h3><p> the link element defines a media attribute that can be used to define the type of media for which the style sheet is designed, such as for display on a monitor or output to a printer</p><br/></h3>
<p>HTML allows us to associate any number of external style sheets with a document. The style sheet language defines how multiple external style sheets interact</p>
<li><a href="css.html"><center>HOME</center></a>
</body>
</html>

OUTPUT:


























Result:
Thus the xhtml page using inline, embedded and external styles.
Ex.No:8        STUDENT INFORMATION WEB PAGE USING JAVASCRIPT    AND FORM TAG

AIM
To develop student information web page using JavaScript and form tag

ALGORITHM

Step 1: Start.
Step 2: Write the web page using Xhtml code
Step 3: Use the <form> tag.
Step 4: Use the JavaScript.
Step 5: Display Results.
Step 6: Stop.

PROGRAM:

<html>
<head>
<script type="text/javascript">
function formval()
{
           
var a = inputform.mark1.value;
var b = inputform.mark2.value;
inputform.total.value = parseInt(a) + parseInt(b);
var name = document.getElementById("name");
var dept = document.getElementById("department");
var regno = document.getElementById("regno");
var mark1 = document.getElementById("mark1");
var mark2 = document.getElementById("mark2");
if(isAlphabet(name,"pls dont enter numbers")&&madeSelection(dept,"please choose a department")&&isNumeric(regno,"enter reg no. oly no.s nd letters allowed for regno.")&&isNumeric(mark1,"enter numbers for mark1")&&isNumeric(mark2,"enter numbers mark2"))
{
window.alert("successfull validation");
return true;
}
else
{
return false;
}
}
function isAlphabet(elem,helperMsg)
{
var alphaExp = /^[a-zA-z]+$/;
if(elem.value.match(alphaExp))
{
return true;
}
else
{
window.alert(helperMsg);
elem.focus();
return false;
}
}
function madeSelection(elem,helperMsg)
{
if(elem.value == "1")
{
window.alert(helperMsg);
elem.focus();
return false;
}
else
{
return true;
}
}
function isNumeric(elem,helperMsg)
{
var alphaExp = /^[0-9a-zA-Z]+$/;
if(elem.value.match(alphaExp)
{
return true;
}
else
{
window.alert(helperMsg);
elem.focus();
return false;
}
}
function isNumeric(elem,helperMsg)
{
var alphaExp = /^[0-9]+$/;
if(elem.value.match(alphaExp))
{
return true;
}
else
{
window.alert(helperMsg);
elem.focus();
return false;
}
}
</script>
</head>
<body>
<form name="inputform">
name: <input type="text" name="name"> </br>
department: <select id="department">
<option value="1">please choose</option>
<option value="2">CSE</option>
<option value="3">ECE</option>
<option value="4">EEE</option>
<option value="5">MECH</option>
</select> </br>       
regno: <input type="text" name="regno"> </br>
mark1: <input type="text" name="mark1"> </br>
mark2: <input type="text" name="mark2"> </br>
total: <input type="text" name="total"> </br>
<input type="button" value="submit" name="submit" onclick="return formval();">
</form>
</body>
</html>















OUTPUT:









  
         











      
       











Result:
Thus the student information web page using JavaScript and form tag was developed and executed successfully.

Ex.No:9        STUDENTS DATABASE USING XML AND XSL

AIM
To develop student database using XML and XSL

ALGORITHM
Step 1: Start.
Step 2: Write the XML code for students database.
Step 3: Use the XSL
Step 4: Display Results.
Step 5: Stop.

PROGRAM:

STUDENT.XML:

<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/Xsl" href="SimpleXml.xsl"?>
<Student>
<Person-Details>
<name>Shrishti</name>
<address>Pune</address>
<year>Second</year>
<marks>70 Percent</marks>
</Person-Details>
<Person-Details>
<name>Shreya</name>
<address>Chennai</address>
<year>Second</year>
<marks>90 Percent</marks>
</Person-Details>
<Person-Details>
<name>Shrish</name>
<address>Mumbai</address>
<year>Fourth</year>
<marks>77 Percent</marks>
</Person-Details>
<Person-Details>
<name>Arjun</name>
<address>Delhi</address>
<year>third</year>
<marks>80 Percent</marks>
</Person-Details>
</Student>

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="blue">
<th>Name</th>
<th>Address</th>
<th>Year</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="Year"/></td>
<td><xsl:value-of select="marks"/></td>
</tr>
</xsl:for-each>
</table>
</body>
</html>
</xsl:template>
</xsl:stylesheet>




























OUTPUT:   






Result:
Thus the student database using XML and XSL was developed and executed successfully.
Ex.No:10   STATIC PAGES (USING ONLY HTML) OF AN ONLINE  BOOK STORE

AIM:
To develop static pages (using only HTML) of an online Book store and the page resemble: www.amazon.com.

HomePage.html
<HTML>
<HEAD><TITLE>HomePage</TITLE></HEAD>
<BODY>
This is HomePage
<HR>
<MARQUEE>WWW.BOOKS.COM</MARQUEE>
<IMG SRC=".\book.gif" height="30%" width="40%">
<PRE>
<A HREF=".\HomePage1.html">Home Page</A>
<A HREF=".\Registration1.html">Registration User Login</A>
<A HREF=".\UserProfile1.html">User Profile Page</A>
<A HREF=".\BooksCatalog1.html">Books Catalog</A>
<A HREF=".\ShoppingCart1.html">Shopping Cart</A>
<A HREF=".\Payment1.html">Payment By CreditCard</A>
<A HREF=".\OrderConfirmation1.html">Order Confirmation</A>
</PRE>
</BODY>
</HTML>


Registration1.html

<HTML><HEAD><TITLE>Registration</TITLE></HEAD>
<BODY>This is Registration User Login<HR>
<MARQUEE>WWW.BOOKS.COM</MARQUEE>
<IMG SRC=".\book.gif" height="30%" width="40%">
<PRE><A HREF="\WEBSITE\HomePage.html">Home Page</A>
<A HREF=".\HomePage1.html">Home Page</A>
<A HREF=".\Registration1.html">Registration User Login</A>
<A HREF=".\UserProfile1.html">User Profile Page</A>
<A HREF=".\BooksCatalog1.html">Books Catalog</A>
<A HREF=".\ShoppingCart1.html">Shopping Cart</A>
<A HREF=".\Payment1.html">Payment By CreditCard</A>
<A HREF=".\OrderConfirmation1.html">Order Confirmation</A>
</PRE><FORM><pre>
Enter your Name :<INPUT TYPE="TEXT">
Enter Password :<INPUT TYPE="PASSWORD">
Confirm Password:<INPUT TYPE="PASSWORD">
Gender :<Input type="Radio" name="R1" value="Male">Male
<Input type="Radio" name="R1" value="Female">Female
Country :<select><option selected>Select Country</option>
<option value="ind">India</option>
<option value="usa">United States of America</option>
<option value="eng">England</option> <option value="aus">Australia</option>
<option value="ger">Germany</option> <option value="pol">Poland</option>
</select><center><Input type="submit"><input type="reset"></center>
</pre></form></BODY></HTML>



USERLOGIN1.HTML:-
<html><head><title>UserLogin</title></head>
<body>
<IMG SRC=".\book.gif" height="30%" width="40%">
<PRE><A HREF="\WEBSITE\HomePage.html">Home Page</A>
<A HREF=".\HomePage1.html">Home Page</A>
<A HREF=".\Registration1.html">Registration User Login</A>
<A HREF=".\UserProfile1.html">User Profile Page</A>
<A HREF=".\BooksCatalog1.html">Books Catalog</A>
<A HREF=".\ShoppingCart1.html">Shopping Cart</A>
<A HREF=".\Payment1.html">Payment By CreditCard</A>
<A HREF=".\OrderConfirmation1.html">Order Confirmation</A>
</PRE>
UserId : <input type="text" id="uid"><br/>
Password: <input type="text" id="pwd"><br />
<br/><input type ="button" value ="LogIn">
</body></html>


PAYMENT1.Html:-

<HTML><HEAD><TITLE>Payment By Credit Card</TITLE></HEAD>
<BODY>
<MARQUEE>WWW.BOOKS.COM</MARQUEE>
<IMG SRC=".\book.gif" height="30%" width="40%">
<PRE>
<A HREF=".\HomePage1.html">Home Page</A>
<A HREF=".\Registration1.html">Registration User Login</A>
<A HREF=".\UserProfile1.html">User Profile Page</A>
<A HREF=".\BooksCatalog1.html">Books Catalog</A>
<A HREF=".\ShoppingCart1.html">Shopping Cart</A>
<A HREF=".\Payment1.html">Payment By CreditCard</A>
<A HREF=".\OrderConfirmation1.html">Order Confirmation</A>
</PRE>
<table border=0 cellpadding=0 cellspacing=0 width=400>
<tr><th>What will it take to pay off my credit card?</th></tr>
<tr><td align=center>
<table cellpadding=2 cellspacing=0>
<tr><td align="right">Enter your credit card balance: $</td><td><input size=6 type=text
id="cwBalance"></td></tr>
<tr><td align="right">Enter the credit card's interest rate: </td><td><input size=6
type=text id="cwRate">%</td></tr>
<tr><td align="right">Enter payment amount per month: $</td><td><input size=6
type=text id="cwMonthlyAmount"></td></tr>
<tr><td align="center"><b>or</b></td><td> </td></tr>
<tr><td align="right">Enter desired months until debt free: </td><td><input size=6
type=text id="cwDesiredMonths"></td></tr>
<tr><td colspan=2 align="center"><input type=button value="Calculate"
onclick="cwCalc();"></td></tr>
<tr><td colspan=2 align="center" id="cwResult"></td></tr>
</table></td></tr>
</table>
</BODY>
</HTML>


Validate the registration, user login, user profile and payment by credit card pages using JavaScript.

REGISTRATION FORM

<Html>
<Head>
<Title>User Registration Form</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript" fptype="dynamicanimation">
</script>
</head>
<body>
<script language="javascript">
function verify(form)
{
if(document.forms[0].elements[0].value=="")
{
alert("Please Enter User ID");
document.forms[0].elements[0].focus();
return(false);
}
if(document.forms[0].elements[1].value=="")
{
alert("Please Enter your Password");
document.forms[0].elements[2].value="";
document.forms[0].elements[1].focus();
return(false);
}
if(document.forms[0].elements[1].value.length<4)
{
alert("Password must be greater than 4 character");
document.forms[0].elements[1].value="";
document.forms[0].elements[2].value="";
document.forms[0].elements[1].focus();
return(false);
}
if(document.forms[0].elements[2].value=="")
{
alert("Please Enter your Confirm Password");
document.forms[0].elements[2].focus();
return(false);
}
if((document.forms[0].elements[1].length)!=(document.forms[0].elements[2].length))
{
alert("Your Password does not match with Confirm Password");
document.forms[0].elements[1].value="";
document.forms[0].elements[2].value="";
document.forms[0].elements[1].focus();
return(false);
}
if((document.forms[0].elements[1].length)==(document.forms[0].elements[2].length))
{
if((document.forms[0].elements[1].value)!=(document.forms[0].elements[2].value))
{
alert("Your Password does not match with Confirm Password");
document.forms[0].elements[1].value="";
document.forms[0].elements[2].value="";
document.forms[0].elements[1].focus();
return(false);
}
}
if(document.forms[0].elements[3].value=="secq")
{
alert("Please Select your Security Question");
document.forms[0].elements[3].focus();
return(false);
}
if(document.forms[0].elements[4].value=="")
{
alert("Please Answer the security question");
document.forms[0].elements[4].focus();
return(false);
}
if(document.forms[0].elements[5].value=="DD")
{
alert("Please select Day of DOB");
document.forms[0].elements[5].focus();
return(false);
}
if(document.forms[0].elements[6].value=="MM")
{
alert("Please select Month of DOB");
document.forms[0].elements[6].focus();
return(false);
}
if(document.forms[0].elements[7].value=="YYYY")
{
alert("Please select Year of DOB");
document.forms[0].elements[7].focus();
return(false);
}
if(document.forms[0].elements[10].checked==true)
{
if(document.forms[0].elements[11].value=="")
{
alert("Please Enter your First Name");
document.forms[0].elements[11].focus();
return(false);
}
if(document.forms[0].elements[13].value=="")
{
alert("Please Enter your Last Name");
document.forms[0].elements[13].focus();
return(false);
}
if(document.forms[0].elements[14].value=="Year")
{
alert("Please specify your Academic year");
document.forms[0].elements[14].focus();
return(false);
}
if(document.forms[0].elements[15].value=="adminyear")
{
alert("Please put your Admission Year");
document.forms[0].elements[15].focus();
return(false);
}
if(document.forms[0].elements[16].value=="dept")
{
alert("Please Select your Department");
document.forms[0].elements[16].focus();
return(false);
}
if(document.forms[0].elements[17].value=="")
{
alert("Please put your Roll Number");
document.forms[0].elements[17].focus();
return(false);
}
if(document.forms[0].elements[17].value!="")
{
r0=document.forms[0].elements[17].value.indexOf('2');
r1=document.forms[0].elements[17].value.indexOf('k');
r2=parseInt(document.forms[0].elements[17].value.charAt(2));
r3=document.forms[0].elements[17].value.indexOf('_');
r4=parseInt(document.forms[0].elements[17].value.charAt(4));
r5=parseInt(document.forms[0].elements[17].value.charAt(5));
r6=parseInt(document.forms[0].elements[17].value.charAt(6));
len=document.forms[0].elements[17].value.length;
if((len!=7)||(r0!=0)||(r1!=1)||(r3!=3)||(r4>6 || r4<1)||(r2>9 || r2<1))
{
alert("Not a valid Roll Number");
document.forms[0].elements[17].focus();
return(false)
}
switch(document.forms[0].elements[16].value)
{
case 'IT':
if(r4!=6||(r5>4||r5<0)||(r6>9||r6<0))
{
alert("Not a valid Roll Number of Information Technology");
document.forms[0].elements[16].focus();
return(false)
}break;
case 'CSE':
if(r4!=5||(r5>4||r5<0)||(r6>9||r6<0))
{
alert("Not a valid Roll Number of Computer Science");
document.forms[0].elements[16].focus();
return(false)
}break;
case 'ECE':
if(r4!=4||(r5>4||r5<0)||(r6>9||r6<0))
{
alert("Not a valid Roll Number of Electronics");
document.forms[0].elements[16].focus();
return(false)
}break;
case 'EE':
if(r4!=2||(r5>6||r5<0)||(r6>9||r6<0))
{
alert("Not a valid Roll Number of Electrical Engineering");
document.forms[0].elements[16].focus();
return(false)
}break;
case 'ME':
if(r4!=3||(r5>6||r5<0)||(r6>9||r6<0))
{
alert("Not a valid Roll Number of Mechanical Engineering");
document.forms[0].elements[16].focus();
return(false)
}break;
case 'CE':
if(r4!=1||(r5>6||r5<0)||(r6>9||r6<0))
{
alert("Not a valid Roll Number of Civil Engineering");
document.forms[0].elements[16].focus();
return(false)
}break;
}
switch(document.forms[0].elements[14].value)
{
case 'Fourth':
if(r2!=1||(r2>9||r2<0))
{
alert("Not a valid Roll Number of Forth Year");
document.forms[0].elements[14].focus();
return(false)
}break;
case 'Third':
if(r2!=2||(r2>9||r2<0))
{
alert("Not a valid Roll Number of Third Year");
document.forms[0].elements[14].focus();
return(false)
}break;
case 'Second':
if(r2!=3||(r2>9||r2<0))
{
alert("Not a valid Roll Second Year");
document.forms[0].elements[14].focus();
return(false)
}break;
case 'First':
if(r2!=4||(r2>9||r2<0))
{
alert("Not a valid Roll Number of First Year");
document.forms[0].elements[14].focus();
return(false)
}break;
}
}
}
if(document.forms[0].elements[24].checked==true)
{
if(document.forms[0].elements[25].value=="")
{
alert("Please Enter Your First Name");
document.forms[0].elements[25].focus();
return(false);
}
if(document.forms[0].elements[27].value=="")
{
alert("Please Enter your Last Name");
document.forms[0].elements[27].focus();
return(false);
}
if(document.forms[0].elements[30].value=="state")
{
alert("Please Select Your State");
document.forms[0].elements[30].focus();
return(false);
}
if(document.forms[0].elements[31].value=="country")
{
alert("Please Select Your State");
document.forms[0].elements[31].focus();
return(false);
}
if((document.forms[0].elements[32].value=="pincode")||(document.forms[0].elements[33].
value=""))
{
alert("Please Select Your Pincode OR if Other specify");
document.forms[0].elements[32].focus();
return(false);
}
}
}
function studentclear(form)
{
document.forms[0].elements[11].value="";
document.forms[0].elements[12].value="";
document.forms[0].elements[13].value="";
document.forms[0].elements[14].value="Year";
document.forms[0].elements[15].value="adminyear";
document.forms[0].elements[16].value="dept";
document.forms[0].elements[17].value="";
document.forms[0].elements[18].value="selecthostel";
document.forms[0].elements[19].value="";
document.forms[0].elements[20].value="";
document.forms[0].elements[21].value="";
document.forms[0].elements[22].value="";
document.forms[0].elements[23].value="";
document.forms[0].elements[25].focus();
}
function generalclear(form)
{
document.forms[0].elements[25].value="";
document.forms[0].elements[26].value="";
document.forms[0].elements[27].value="";
document.forms[0].elements[28].value="City";
document.forms[0].elements[29].value="";
document.forms[0].elements[30].value="state";
document.forms[0].elements[31].value="country";
document.forms[0].elements[32].value="pincode";
document.forms[0].elements[33].value="";
document.forms[0].elements[34].value="";
document.forms[0].elements[35].value="";
document.forms[0].elements[36].value="";
document.forms[0].elements[37].value="";
document.forms[0].elements[11].focus();
}
</script>
<body onLoad=document. forms [0].elements[0].focus();>
<form action ="" method="post" onsubmit="return verify(this.form)">
<center>
<p dynamicanimation="fpAnimelasticRightFP1" id="fpAnimelasticRightFP1"
style="position: relative !important; visibility: hidden" language="Javascript1.2">
<font size="6" face="Monotype Corsiva" color="#800000">New User Registration
Form</font></p>
</center><br>
<i><font color="#FF0000"><font face="Arial" size="4">*</font>
<font face="Arial" size="2"></font> </font>
<font face="Arial" size="2"color="#FF0000">Indicates all the fields are
mandatory</font></i><hr><p>
<font size="4" face="Arial, Helvetica, sans-serif" color="#FF0000">*</font>
<font size="-1" face="Arial, Helvetica,sans-serif">User ID:</font><b>
<input name="uid" size="16" maxlength="15"></b>
<font color="#FF0033" size="2"> </font>
<font face="Arial" size="2" color="#FF0033">
(Contains only letters (a-z), numbers (0-9) and underscore)</font>
<br><b><br></b>
<font size="4" face="Arial, Helvetica, sans-serif" color="#FF0000">*</font>
<font size="-1" face="Arial, Helvetica,sans-serif">Password: </font>
<font color="#000000"> </font>
<input type="password" name="pswd" size="9" maxlength="10" style="font-weight: bold;
color:#008000">
<font color="#000000"size="2"><font face="Arial"> </font></font>
<font color="#FF0033" size="2" face="Arial">
(Password should be of minimum 4(four) and maximum 10(ten) characters. </font>
<font size="2"><font color="#FF0033" face="Arial">) </font></p>
</font> <font face="ARIAL, HELVETICA" size="-1"> </font>
<font size="4" face="Arial, Helvetica, sans-serif" color="#FF0000">*</font>
<font face="ARIAL, HELVETICA" size="-1">Re-Type Password</font>:<font size="2">
<b>
<input type="password" name="cpswd" size="11" maxlength="10" style="color:#008000"
></b> </font>
<hr><font size="2"> </font><font size="2">
<font face="Arial, Helvetica, sans-serif">
<i>If you forget your password, you can retrieve it by answering your unique hint
question. <br>
Frame your question such that only you know its answer.
</i></font></font>
<div align="center"><font face="Arial" size="2"></font>
<font face="Arial" size="2"></font><font face="Arial" size="2"></font>
<font face="Arial" size="2"></font></div>
<font face="Arial" size="2"><br></font>
<font size="2"><font face="Arial">
<font face="Arial,Helvetica, sans-serif"></font></font></font>
<font size="4" face="Arial, Helvetica, sans-serif" color="#FF0000">*</font>
<font size="2"><font face="Arial">
<font face="Arial, Helvetica,sans-serif">
Select a question forgetting password </font><b>: </b></font>
<select size="1" name="secq">
<option selected value="secq">Select a hit question ?</option>
<option value="What is your favourite multimedia software?">
What is your favourite multimedia software?</option>
<option value="What is your favourite game?">What is your favourite game?</option>
<option value="who is your favourite Cricketer?">
who is your favourite Cricketer? </option>
<option value="who is your favourite Film Actor?">
who is your favourite Film Actor?</option>
<option value="what is your favourite food?">what is your favourite food?</option>
</select><font face="Arial"><b>
</b></font></font><p><font size="2">
</font><font size="4" face="Arial, Helvetica, sans-serif" color="#FF0000">*</font>
<font color="#000000" face="Arial, Helvetica, sans-serif" size="2">Hit Answer:
<input type="text" name="seca" size="21"> </font>
<font size="2"><font color="#000000" face="Arial, Helvetica,sans-serif"> </font>
<font color="#FF0033" face="Arial">(Write Your Answer)</font>
<font color="#000000" face="Arial"> </font>
</font><font size="1"></p></font>
<hr><div align="left"><font face="Arial,Helvetica, sans-serif" size="-1">
DD MM YYYY <br>
</font>
<font size="4" face="Arial, Helvetica, sans-serif"color="#FF0000">*</font>
<font face="Arial, Helvetica, sans-serif" size="-1">Date of Birth:
<select size="1" name="DD">
<option selected value="DD">Day</option> <option value="1">1</option>
<option value="2">2</option> <option value="3">3</option>
<option value="4">4</option> <option value="5">5</option>
<option value="6">6</option> <option value="7">7</option>
<option value="8">8</option> <option value="9">9</option>
<option value="10">10</option> <option value="11">11</option>
<option value="12">12</option> <option value="13">13</option>
<option value="14">14</option> <option value="15">15</option>
<option value="16">16</option> <option value="17">17</option>
<option value="18">18</option> <option value="19">19</option>
<option value="20">20</option> <option value="21">21</option>
<option value="22">22</option> <option value="23">23</option>
<option value="24">24</option> <option value="25">25</option>
<option value="26">26</option> <option value="27">27</option>
<option value="28">28</option> <option value="29">29</option>
<option value="30">30</option> <option value="31">31</option>
</select>
<select size="1" name="MM">
<option selected value="MM">Month</option><option
value="JANUARY">JAN</option>
<option value="FEBRUARY">FEB</option> <option
value="MARCH">MAR</option>
<option value="APRIL">APR</option> <option value="MAY">MAY</option>
<option value="JUNE">JUN</option> <option value="JULY">JUL</option>
<option value="AUGUST">AUG</option> <option
value="SEPTEMBER">SEP</option>
<option value="OCTOBER">OCT</option><option
value="NOVEMBER">NOV</option>
<option value="DECEMBER">DEC</option>
</select>
<select size="1" name="YYYY">
<option selected value="YYYY">Year</option> <option value="1970">1970</option>
<option value="1971">1971</option> <option value="1972">1972</option>
<option value="1973">1973</option> <option value="1974">1974</option>
<option value="1975">1975</option> <option value="1976">1976</option>
<option value="1977">1977</option> <option value="1978">1978</option>
<option value="1979">1979</option> <option value="1980">1980</option>
<option value="1981">1981</option> <option value="1982">1982</option>
<option value="1983">1983</option> <option value="1984">1984</option>
<option value="1985">1985</option> <option value="1986">1986</option>
<option value="1987">1987</option> <option value="1988">1988</option>
<option value="1989">1989</option> <option value="1990">1990</option>
<option value="1991">1991</option> <option value="1992">1992</option>
<option value="1993">1993</option> <option value="1994">1994</option>
<option value="1995">1995</option> <option value="1996">1996</option>
<option value="1996">1996</option> <option value="1997">1997</option>
<option value="1998">1998</option> <option value="1999">1999</option>
<option value="2000">2000</option> <option value="2001">2001</option>
<option value="2002">2002</option> <option value="2003">2003</option>
<option value="2004">2004</option> <option value="2005">2005</option>
<option value="2006">2006</option> <option value="2007">2007</option>
<option value="2008">2008</option> <option value="2009">2009</option>
<option value="2010">2010</option> <option value="2011">2011</option>
<option value="2012">2012</option> <option value="2013">2013</option>
<option value="2014">2014</option> <option value="2015">2015</option>
<option value="2016">2016</option> <option value="2017">2017</option>
<option value="2018">2018</option> <option value="2019">2019</option>
<option value="2020">2020</option> </select></font></div>
<p><font face="Arial, Helvetica, sans-serif" size="-1"></font>
<font size="4" face="Arial, Helvetica, sans-serif" color="#FF0000">*</font>
<font face="Arial, Helvetica, sans-serif" size="-1">
Gender:
<input type="radio" name="Male" value="male" checked> Male
<INPUT type=radio value="female" name="Male" >Female
</font>
<hr><font size="4" face="Arial, Helvetica, sans-serif" color="#FF0000"> </font>
<p> <font face="Arial, Helvetica, sans-serif" size="-1">
Contact No: <input type="text" size="6" name="std" maxlength="6"><b> -</b>
<input type="text" size="9" name="phno" maxlength="9">
</font><p>
<font face="Arial, Helvetica, sans-serif" size="-1">
Mobile No: <input type="text" size="18" name="mobno" maxlength="15"></font><p>
<font face="Arial, Helvetica, sans-serif" size="-1">
Email:<input type="text" name="email" size="20">
</font><p><hr>
<div align="left"><font face="Arial, Helvetica, sans-serif" size="-1">
</font> </div><center>
<input type="submit" value="Submit" name="Submit" tabindex="25">
<input type="reset" value="Reset" name="Reset" tabindex="26">
</center></form></body></html>

 USER LOGIN:-
<html><head><script>
function f()
{
if(document.getElementById('uid').value.length==0)
alert("UserId can't e blank");
else if(document.getElementById('pwd').value.length==0)
alert("Password can't be blank");
else
{
alert("successfully logged in");
window.open("Welcome.html");}
}
</script></head>
<body>
UserId : <input type="text" id="uid"><br/>
Passowrd: <input type="text" id="pwd"><br />
<br/><input type ="button" onclick="f()" value ="LogIn">
</body></html>

OUTPUT:-

USER PROFILE
<html>
<head>
<title>User Profile</title>
</head>
<body>
<H1>User Profile</H1>
<Hr>
<pre>
<b>Name : </b>
<b>E-Mail ID : </b>
<b>Date of Birth : </b>
<b>Gender : </b>
<b>City : </b>
<b>State : </b>
<b>Country : </b>
<b>Zip Code : </b>
</pre>
</Body>
</Html>

























OUTPUT:-

PAYMENT BY CREDIT CARD
<HTML><HEAD>
<style type="text/css">
<!--
.cwCalc{border:1px solid black;}
.cwCalc TH{background-color:#BBBBBB;}
.cwCalc TD{background-color:#DDDDDD;}
-->
</style>
<script type="text/javascript">
function cwCalc()
{
if (cwBalance.value=='') {
alert('Please enter your credit card balance.'); return;}
if (cwRate.value=='') {
alert('Please enter your credit card\'s interest rate.'); return;}
if ( (cwMonthlyAmount.value=='' && cwDesiredMonths.value=='') ||
(cwMonthlyAmount.value!='' && cwDesiredMonths.value!='') ) {
alert('Please enter either a payment amount or desired months.'); return;}
var mRate=(cwRate.value/100)/12;
if (cwMonthlyAmount.value=='')
{
var payment=cwBalance.value*(mRate) / (1-Math.pow((1+mRate),(-
cwDesiredMonths.value)) );
payment=Math.round(payment*100)/100;
cwResult.innerHTML="It will cost $" + payment.toFixed(2) + " a month to pay off this
card and will cost you a total of $" + (payment*cwDesiredMonths.value).toFixed(2) + ".";
}
else {
var remainingBalance=cwBalance.value;
var minPayment=mRate*cwBalance.value;
var months=0;
var lastPayment;
if (minPayment>cwMonthlyAmount.value) {
alert ('Your monthly payment is less than the monthly interest charged by this card.');
return;}
while (remainingBalance>0)
{
months++;
remainingBalance=remainingBalance*(1 + mRate)-cwMonthlyAmount.value;
}
cwResult.innerHTML="It will take " + months + " months to pay off this card and will cost
you a total of $" + (cwMonthlyAmount.value*months).toFixed(2) + ".";
}
}
</script>
</HEAD>
<BODY>
<table class="cwCalc" border=0 cellpadding=0 cellspacing=0 width=400>
<tr><th>What will it take to pay off my credit card?</th></tr>
<tr><td align=center>
<table cellpadding=2 cellspacing=0>
<tr><td align="right">Enter your credit card balance: $</td><td><input size=6 type=text
id="cwBalance"></td></tr>
<tr><td align="right">Enter the credit card's interest rate: </td><td><input size=6
type=text id="cwRate">%</td></tr>
<tr><td align="right">Enter payment amount per month: $</td><td><input size=6
type=text id="cwMonthlyAmount"></td></tr>
<tr><td align="center"><b>or</b></td><td> </td></tr>
<tr><td align="right">Enter desired months until debt free: </td><td><input size=6
type=text id="cwDesiredMonths"></td></tr>
<tr><td colspan=2 align="center"><input type=button value="Calculate"
onclick="cwCalc();"></td></tr>
<tr><td colspan=2 align="center" id="cwResult"></td></tr>
</table></td></tr>
<tr>
<td align=right valign=top style="font-weight:bold;font-size:8pt;">
Powered by:<a href="http://www.creditorweb.com/CreditCards/" target="_blank">
<img src="http://www.creditorweb.com/images/logosmall.png" border="0" alt="Compare
credit cards and find credit card tools and articles at Creditor Web"></a></td></tr>
</table>
<p><center>
<font face="arial, helvetica" size"-2">Free JavaScripts provided<br>by
<a href="http://srinu.com">The JavaScript Source</a></font>
</center><p>
</BODY>
</HTML>

















Result:
Thus the static pages (using only HTML) of an online Book store and the page resemble: www.amazon.com.
Ex.No:11        CREATE AND SAVE AN XML DOCUMENT AT THE SERVER

AIM:
To create and save an XML document at the server and it contains user information.

PROGRAM

filename:Usevalidation.html

<html>
<head>
<title>Login Form</title>
</head>
<body leftmargin=75 topmargin=75 bgcolor=white>
<form method=Get action="http:127.0.0.1:8080\validation">
UserName&nbsp;&nbsp;<input type=text name=user>
<br><br>
Password&nbsp;&nbsp;<input type=password name=pass>
<br><br>
<input type=submit value=submit>&nbsp;&nbsp;&nbsp;
<input type=reset name=cancel>
</form>
</body>
</html>


filename:UserValid.java
import javax.servlet.*;
import javax.servlet.http.*;
import java.io.*;
public class UserValid extends HttpServlet
{
public void doGet(HttpServletRequest req,HttpServletResponse res)throws
ServletException,IOException
{
res.setContentType("text/html");
PrintWriter out=res.getWriter();
String usr=res.getParameter("user");
String pwd=res.getParameter("pass");
if(usr equals("naveen")&&pwd equals("nav")
out.println("Successfully Logged in");
else
out.println("Unsuccessful");
}
}
filename:web.xml

<web-app>
<servlet>
<servlet-name>UserValidation</servlet-name>
<servlet-class>UserValid</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>UserValidation</servlet-name>
<url-pattern>/validation/*</url-pattern>
</servlet-mapping>
</web-app>





Result:
Thus the Creation and Save Option of an Xml Document at the Server was done Successfully.


Ex.No:12               JSP SOURCE CODE FOR BASIC ARITHMETIC EXAMPLE

AIM:
           To write the JSP Source Code for Basic Arithmetic Example

PROGRAM:
<html>
<head>
<title>JSP 2.0 Expression Language - Basic Arithmetic</title>
</head>
<body>
<h1>JSP 2.0 Expression Language - Basic Arithmetic</h1>
<hr>
This example illustrates basic Expression Language arithmetic.
Addition (+), subtraction (-), multiplication (*), division (/ or div),
and modulus (% or mod) are all supported. Error conditions, like
division by zero, are handled gracefully.
<br>
<blockquote>
<code>
<table border="1">
<thead>
<td><b>EL Expression</b></td>
<td><b>Result</b></td>
</thead>
<tr>
<td>\${1}</td>
<td>${1}</td>
</tr>
<tr>
<td>\${1 + 2}</td>
<td>${1 + 2}</td>
</tr>
<tr>
<td>\${1.2 + 2.3}</td>
<td>${1.2 + 2.3}</td>
</tr>
<tr>
<td>\${1.2E4 + 1.4}</td>
<td>${1.2E4 + 1.4}</td>
</tr>
<tr>
<td>\${-4 - 2}</td>
<td>${-4 - 2}</td>
</tr>
<tr>
<td>\${21 * 2}</td>
<td>${21 * 2}</td>
</tr>
<tr>
<td>\${3/4}</td>
<td>${3/4}</td>
</tr>
<tr>
<td>\${3 div 4}</td>
<td>${3 div 4}</td>
</tr>
<tr>
<td>\${3/0}</td>
<td>${3/0}</td>
</tr>
<tr>
<td>\${10%4}</td>
<td>${10%4}</td>
</tr>
<tr>
<td>\${10 mod 4}</td>
<td>${10 mod 4}</td>
</tr>
<tr>
<td>\${(1==2) ? 3 : 4}</td>
<td>${(1==2) ? 3 : 4}</td>
</tr>
</table>
</code>
</blockquote>
</body>
</html>


OUTPUT:
JSP 2.0 Expression Language - Basic Arithmetic





Result:
    Thus the JSP Source Code for Basic Arithmetic Example was created and executed successfully.
Ex.No:13            JAVA SCRIPT IN HTML PAGE

AIM:
Write Java Script that inputs three integers from the user and outputs their
sum, average, largest. Use alert dialog box to display results.

PROGRAM:

<html>
<head> <title> MAX </title>
<script language="javascript">
var a,b,c,n1,n2,n3,m1,m2,sum,avg;
a=prompt("enter 1st no="," ");
b=prompt("enter 2nd no="," ");
c=prompt("enter 3rd no="," ");
n1=parseInt(a);
n2=parseInt(b);
n3=parseInt(c);
sum=n1+n2+n3;
avg=sum/3;
m1=Math.max(n1,n2);
m2=Math.max(n3,m1);
alert("the sum is= "+sum);
alert("the avg is= "+m2);
alert("the max no is "+m2);
</script> </head>
</html>







OUTPUT:




Result:
Thus the Java Script that inputs three integers from the user and outputs their
sum, average, largest. Use alert dialog box to displayed results.
Ex.No:14        WORD EQUIVALENT OF A CHECK AMOUNT

AIM
Write a script to write word equivalent of a check amount.

PROGRAM

<html>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
var checkflag = "false";
function check(field)
{
     if (checkflag == "false")
    {
   for (i = 0; i < field.length; i++)
      {
field[i].checked = true;}
checkflag = "true";
return "Uncheck All";
                 }
                 else
                  {
      for (i = 0; i < field.length; i++)
        {
         field[i].checked = false;
         }
checkflag = "false";
return "Check All";
}
     }
</script>
</HEAD>
<BODY>
<center>
     <form name=myform action="" method=post>
     <table>
<tr><td>
<b>Your Favorite Scripts & Languages</b><br>
<input type=checkbox name=list value="1">Java<br>
<input type=checkbox name=list value="2">JavaScript<br>
<input type=checkbox name=list value="3">ASP<br>
<input type=checkbox name=list value="4">HTML<br>
<input type=checkbox name=list value="5">SQL<br>
<br>
<inputtype=button value="Check All"
onClick="this.value=check(this.form.list)">
</td></tr>
       </table>
     </form>
</center>
</body>
</html>

OUTPUT:

Result:
Thus the script for word equivalent of a check amount was created and executed successfully.
Ex.No:15            PRACTICE WRITING CSS RULES

AIM
To practice writing CSS rules

PROGRAM

<html>
<head>
<title>style sheets</title>
<style type=”text/css”></head>
em{backgroundcolor:#8000ff;color=white}
h1{font family:Lucida console;color:red}
p{font size:30pt}
sp{color:red}
</style>
</head>
<body>
<h2class=”sp”>testing</h2>
<em><h1>test</h1></em>
<em>test1</em>
<p>test2</p>
</body>
</html>

OUTPUT:
testing
test
test1
test2
Result:
            Thus the practice writing CSS rules was used and executed successfully.
Ex.No:16            PROGRAM FOR FACTORIAL
AIM
To write the program for Factorial

PROGRAM

<html>
<head><u><center><b>RECURSIVE FACTORIAL</b><br></u>
<title>factorial</title>
<script lang="javascript">
var i,fact,a,n;
a=prompt("enter any no","0");
n=parseInt(a);
for (i=1;i<=n;i++)
{
res=fact(i);
document.writeln("<br> THE FACTORIAL OF "+i+" IS >> "+res);
}
function fact(x)
{
If(x==0 || x==1)
 return(1);
else
         return(x*fact(x-1));
           }
</script>
</head>
</html>





OUTPUT











Result:
Thus the Program for Factorial was executed successfully.

Ex.No:17            PROGRAM FOR BUBBLE SORT

AIM
To write the program for Bubble Sort

PROGRAM

<html>
<head>
<title>Bubble Sort</title>
<script language="JavaScript">
var a=[3,5,2,9,1,8]
var t,n=6;
for( var i=0;i<n;i++)
{
  for(var j=0;j<n-1;j++)
  {
  if(a[j]>a[j+1])
    {
     t=a[j];
a[j]=a[j+1];
a[j+1]=t;
   }
}
         }
document.write("<h1>The sorted order is:&nbsp;");
for(i=0;i<n;i++)
{
document.write(a[i]);
document.write("&nbsp;&nbsp;");
}
</script>
</head>
<body topmargin=50 leftmargin=100></body>
</html>



OUTPUT:
    The sorted order is: 1 2 3 5 8 9














Result:
            Thus the program for Bubble Sort was executed successfully.


Ex.No:18        DISPLAYING AN IMAGE ON MOUSE CLICK
AIM
To write the program for displaying an image on mouse click

PROGRAM

<html>
<head>
<title>onclick image</title>
</head>
<body leftmargin=100 topmargin=100 bgcolor="#111111">
<img name="images" width=200 height=200 src=1.gif "><p>
<form><h3>
<input type="button" value="image1"
onClick="document.images.src='1.gif' ">
<input type="button" value="image2"
onClick="document.images.src='2.gif' ">
<input type="button" value="image3"
onClick="document.images.src='3.gif' ">
           </form></h3>
</body>
</html>







OUTPUT


Result:
          Thus the program for displaying an image on mouse click was executed successfully.
Ex.No:19            EXHIBIT BLENDING EFFECT

AIM
To create the program code to Exhibit Blending Effect

PROGRAM

<html>
<head>
<title> J Script </title>
<script language="javascript">
function blendOut()
{
//textInput.filters("blendTrans").apply();
//textInput.style.visibility="hidden";
textInput.filters("blendTrans").play();
}
</script>
</head>
<body>
<div id="textInput" onmouseover="blendOut()" style="width:100;
filter:blendTrans(duration=5)">
<h1> MULTI MEDIA </h1>
</div>
</body>
</html>





OUTPUT:











Result:
             Thus the program code to Exhibit Blending Effect was executed successfully.

No comments:

Post a Comment