You are on page 1of 12

Image Mapping Output:

<html>
<body>
<p>
<b>Some Popular Planets from Solar
system</b>
</p>
<img src="C:\Documents and
Settings\User\My Documents\My
Pictures\solar system.jpg"
width="145" height="126"
usemap="#solarmap">
<map id="solarmap" name="solarmap">
<area shape="rect"
coords="10,10,40,25"
alt="Mercury"
href="D:\\HTML_Examples\Mercury.html"
>
<area shape="rect"
coords="35,20,75,55"
alt="venus"
href="D:\\HTML_Examples\venus.htm">
<area shape="rect"
coords="65,55,115,85"
alt="Earth"
href="D:\\HTML_Examples\earth.htm">
<area shape="rect"
coords="90,85,135,120"
alt="Saturn"
href="D:\\HTML_Examples\saturn.htm">
</map>
<p><b>Note:</b> Some Planets from our
solar system are displayed here click on any
planet and you will get some useful
information about them</p>
</body>
</html>
Types of Cascading Style Sheets

<!DOCTYPE html PUBLIC "-//W3C//DTD RAM is the best known form of computer
XHTML 1.0 Transitional//EN" memory and easy to upgrade. See more
"http://www.w3.org/TR/xhtml1/DTD/xhtml computer hardware pictures.
1-transitional.dtd"> Random access memory (RAM) is the best
<html known form of computer memory. RAM is
xmlns="http://www.w3.org/1999/xhtml"><h considered "random access" because you
ead> can access any memory cell directly if you
<meta http-equiv="Content-Type" know the row and column that intersect at
content="text/html; charset=iso-8859-1" /> that cell.
<title>Types of CSS</title> </p>
<!--External Style Sheet--> <!-- Inline StyleSheet-->
<link rel="stylesheet" type="text/css" href=" <h4 style="text-align:center">This is the
external.css" /> output for InLine Stylesheet</h4>
<!--Internal or Embedded Style Sheet--> <p style="background:#CC0033;
<style type="text/css"> background-image:url(../../../Program
h2 Files/Apache Software Foundation/Tomcat
{ 6.0/Sunset.jpg);">
background-color:#009933; </body>
background-position:center; RAM is the best known form of computer
background-repeat:repeat-x; memory and easy to upgrade. See more
font-family:Georgia, "Times New Roman", computer hardware pictures.
Times, serif; Random access memory (RAM) is the best
font-size:18px; known form of computer memory. RAM is
} considered "random access" because you
h3 can access any memory cell directly if you
{ know the row and column that intersect at
border-width:thin; that cell.
border-style:dashed; </p>
border-top-color:#00FF66; </html>
border-width:thick;
}
</style> external.css
</head> body
<body> {
<h4 style="text-align:center">This is the font-family: Arial, Helvetica, sans-
output for External Stylesheet</h4> serif;
<h1>Hi</h1> background:#999999;
<h4 style="text-align:center">This is the border:thin;
output for Internal or Embedded }
Stylesheet</h4> P
<h2>Hello</h2> {
<h3>Welcome</h3> font:Arial, Helvetica, sans-serif;
<p> font-size:12px;
font-size-adjust:inherit; Ex #3:
font-stretch:ultra-condensed;
font-weight:900; Form Validation using JavaScript
text-align:center;
text-decoration:line-through; <html>
text-transform:uppercase; <head>
} <title>The Student Registration
h1 { Form</title>
font-family: Arial, Helvetica, sans- <script type=text/javascript>
serif; function validate()
font-variant:small-caps; {
color: #CC3300; var i;
} var name_str=document.my_form.name;
var phoneID=document.my_form.ph_txt;
var
Output: ph_str=document.my_form.ph_txt.value;
var str=document.my_form.Email_txt.value;
if((name_str.value==null)||
(name_str.value==""))
{
alert("Enter some name")
return false
}
if(document.my_form.Age_txt.value=="")
{
alert("Enter Some Age")
return false
}
if((document.my_form.Age_txt.value<"5")
&&
(document.my_form.Age_txt.value>"21"))
{
alert("Invalid Age")
return false
}

if(ph_str.length<1 ||ph_str.length>11)
{
alert("Invalid length of Phone Number")
return false
}
for (i = 0; i < ph_str.length; i++)
{
var ch = ph_str.charAt(i);
if (((ch < "0") || (ch > "9"))){
alert("Invalid Phone Number")
phoneID.focus()
return false !document.my_form.group1[0].checked)
} {
} alert("Please Select Sex");
var index_at=str.indexOf("@") return false;
var len=str.length }
var index_dot=str.indexOf(".") return true
var emailID=document.my_form.Email_txt
if ((emailID.value==null)|| }
(emailID.value=="")) </script>
{ </head>
alert("Please Enter your Email ID") <body bgcolor=aqua>
emailID.focus() <center><h3>Application
return false Form</h3></center>
} <form name=my_form
if (str.indexOf("@")==-1) onsubmit=validate()>
{ <strong>Name:&nbsp&nbsp&nbsp&nbsp&
alert("Invalid E-mail ID") nbsp&nbsp&nbsp</strong>
return false <input type=text name=name><br/>
} <strong>Age:&nbsp&nbsp&nbsp&nbsp&n
if (str.indexOf(".")==-1 || bsp&nbsp&nbsp&nbsp&nbsp&nbsp</stron
str.indexOf(".")==0 || g>
str.indexOf(".")==index_at) <input type=text name=Age_txt><br/>
{ <strong>Phone No:&nbsp</strong>
alert("Invalid E-mail ID") <input type=text name=ph_txt><br/>
return false <strong>Email:&nbsp&nbsp&nbsp&nbsp&
} nbsp&nbsp&nbsp&nbsp</strong>
<input type=text
if (str.indexOf("@",(index_at+1))!=-1) name=Email_txt><br/><br/>
{ <strong>Sex:&nbsp&nbsp&nbsp&nbsp&nb
alert("Invalid E-mail ID") sp&nbsp&nbsp </strong>
return false <input type="radio" name="group1"
} value="Male">Male&nbsp&nbsp&nbsp&nb
if (str.indexOf(" ")!=-1) sp
{ <input type="radio" name="group1"
alert("Invalid E-mail ID") value="Female">Female<br/><br/><br/>
return false <strong>Hoby: </strong>
} &nbsp&nbsp
if (!document.my_form.group1[0].checked <input type="checkbox" name ="option1"
&& value="Singing">Singing<br/>
!document.my_form.group1[0].checked) &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb
{ sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
alert("Please Select Sex"); <input type="checkbox" name ="option1"
return false; value="Reading">Reading<br/>
} &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nb
if (!document.my_form.group1[0].checked sp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
&&
<input type="checkbox" name ="option1" Source Code:
value="T.V.">Watching T.V<br/>
<br/><br/> App.java
<strong>Country:</strong>
<select name="My_Menu"> //This program changes the color of text
<option value="India">India</option> //It also set the background color
<option value="China">China</option> //It also loads the image
<option //It makes use of checkboxgroup and button
value="Shrilanka">Shrilanka</option>
</select> import java.awt.*;
<center> import java.awt.event.*;
<input type=submit value=Submit></br> import java.applet.*;
</center> /*
</body> <applet code="Experiment3" width=300
</html> height=300>
Output: </applet>
*/
public class App extends Applet implements
ItemListener
{
int currcolor=5;
int flag=1;
String text="Click any of the button";
Button buttons[]=new Button[5];
String
colours[]={"Red","Blue","Green","Yellow",
"Magenta"};
Image img;
CheckboxGroup cbg=new
CheckboxGroup();
Checkbox box1=new
Checkbox("Background Color",cbg,true);
Checkbox box2=new Checkbox("Text
Color",cbg,false);
Checkbox box3=new Checkbox("Loading
Image",cbg,false);
public void init()
{
for(int i=0;i<5;i++)
{
buttons[i]=new Button(" ");
add(buttons[i]);
}
buttons[0].setBackground(Color.red);
buttons[1].setBackground(Color.blue);
buttons[2].setBackground(Color.green);
Ex #4: buttons[3].setBackground(Color.yellow);
buttons[4].setBackground(Color.magenta); g.setColor(Color.magenta);
add(box1); break;
add(box2); case 5:
add(box3); g.setColor(Color.black);
box1.addItemListener(this); break;
box2.addItemListener(this); }
box3.addItemListener(this); g.drawString(text,30,100);
} }
public void itemStateChanged(ItemEvent else if(flag==1)
ev) {
{ g.drawString(text,30,100);
if(box1.getState()==true) switch(currcolor)
flag=1; {
else if(box2.getState()==true) case 0:
{ setBackground(Color.red);
text="Default color is black"; break;
flag=2; case 1:
} setBackground(Color.blue);
else if(box3.getState()==true) break;
{ case 2:
img=getImage(getDocumentBase(),"cutecat. setBackground(Color.green);
jpg"); break;
flag=3; case 3:
} setBackground(Color.yellow);
repaint(); break;
} case 4:
public void paint(Graphics g) setBackground(Color.magenta);
{ break;
if(flag==2) case 5:
{ setBackground(Color.white);
g.drawString(text,30,100); break;
switch(currcolor)
{ }
case 0: }
g.setColor(Color.red); else if(flag==3)
break; {
case 1: g.drawImage(img,20,90,this);
g.setColor(Color.blue); }
break; }
case 2: public boolean action(Event e,Object o)
g.setColor(Color.green); {
break; for(int i=0;i<5;i++)
case 3: {
g.setColor(Color.yellow); if(e.target==buttons[i])
break; {
case 4: currcolor=i;
text="You have chosen "+colours[i]; Source Code:
repaint();
return true; my_servletDemo.java
}
} Servlet Program:
return false;
} import java.io.*;
} import java.util.*;
Output: import javax.servlet.*;
public class my_servletDemo extends
GenericServlet
{
public void service(ServletRequest
req,ServletResponse res)
throws ServletException,IOException
{
PrintWriter out=res.getWriter();
Enumeration en=req.getParameterNames();
while(en.hasMoreElements())
{
String
name_received=(String)en.nextElement();
out.print(name_received+ " = ");
String
value_received=req.getParameter(name_rec
eived);
out.println(value_received);
out.println(" ");
}
out.close();
}
}

Ex #5: HTML Program:


<html>
<head>
<title>Student Information Form</title>
</head>
<body>
<center>
<form name="form1"
action="http://localhost:8080/my_servletDe
mo" method="post">
<h3>Enter student information in following
fields -</h3>
<table>
<tr>
<td><b>Roll Number</b></td>
<td><input type="text" name="Roll
Number" size="25" value=" "></td>
</tr>
<tr>
<td><b>Student Name</b></td>
<td><input type="text" name="Student
Name" size="25" value=" "></td>
</tr>
<tr>
<tr>
<td><b>Student Address</b></td>
<td><input type="text" name="Address"
size="50" value=" "></td>
</tr>
<tr>
<td><b>Phone</td>
<td><input type="text" name="Phone"
size="25" value=" "></td>
</tr>
<tr>
<td><b>Total Marks</td>
<td><input type="text" name="Total
Marks" size="10" value=" "></td>
</tr>
</table>
<input type="submit" value="submit">
</form>
</center>
</body>
</html>
Output:
Ex #6

Source code: Exam.jsp if(ans5.equals("True"))


a5=0;
<%@ page language="java" else
import="java.sql.*" %> a5=2;
<%@ page import="java.io.*" %> int Total=a1+a2+a3+a4+a5;
<%@ page import="java.util.*" %>
<% stmt = connect.createStatement();
String SeatNum,Name; String query = "INSERT INTO
String ans1,ans2,ans3,ans4,ans5; StudentTable (" + "Seat_no,Name,Marks" +
int a1,a2,a3,a4,a5; ") VALUES ('" +SeatNum + "', '" + Name +
a1=a2=a3=a4=a5=0; "', '"+Total+ "')";
Connection connect=null; int result = stmt.executeUpdate(query);
Statement stmt=null; stmt.close();
ResultSet rs=null; stmt = connect.createStatement();
Class.forName("sun.jdbc.odbc.JdbcOdbcDri query = "SELECT * FROM StudentTable
ver"); WHERE Name="+"'"+Name+"'";
String url = "jdbc:odbc:StudentDB1"; rs = stmt.executeQuery(query);
connect = %>
DriverManager.getConnection(url, " ", " "); <html><head><title>Student Mark
if(request.getParameter("action")!=null) List</title></head>
{ <body bgcolor=khaki>
SeatNum = <center>
request.getParameter("Seat_no"); <h2>Students Marksheet</h2>
Name = request.getParameter("Name"); <h3>Name of the College:ABC College of
ans1 =request.getParameter("group1"); Engineering</h3>
if(ans1.equals("True")) <table border="1" cellspacing="0"
a1=2; cellpadding="0">
else <tr>
a1=0; <td><b>Seat_No</b></td>
ans2 = request.getParameter("group2"); <td><b>Name</b></td>
if(ans2.equals("True")) <td><b>Marks</b></td>
a2=0; </tr>
else <%
a2=2; while(rs.next())
ans3 = request.getParameter("group3"); {
if(ans3.equals("True")) %>
a3=0; <tr>
else <td><%=rs.getInt(1)%></td>
a3=2; <td> <%=rs.getString(2)%></td>
ans4 = request.getParameter("group4"); <td> <%=rs.getString(3)%></td>
if(ans4.equals("True")) </tr>
a4=2; <%
else }
a4=0; rs.close();
ans5 = request.getParameter("group5");
stmt.close(); name="entry" onSubmit="return
connect.close(); validation(this)">
%> <input type="hidden" value="list"
</table> name="action">
</center> <table>
<br/> <br/><br/> <tr>
<table> <td><h3>Seat Number:</h3></td>
<tr><td><b>Date:<%=new <td><input type="text"
java.util.Date().toString() %></td></tr> name="Seat_no"></td>
<tr><td><b>Signature: X.Y.Z. </tr>
<b></td></tr> <tr>
</table> <td><h3>Name:</h3></td>
<div> <td><input type="text" name="Name"
<a href="http://127.0.0.1:8080/jsp- size="50"></td>
examples/StudExam/Exam.jsp">Click here </tr>
to go back</a> <hr/>
</body> <tr>
</html> <td><b>Total Marks:10(Each question
<%}else{%> carries equal marks) </b></td>
<html> <td></td><td></td><td></td><td><b>Time
<head><title>Online Examination</title> : 15 Min.</b></td>
<script language="javascript"> </tr>
function validation(Form_obj) </table>
{ <hr/>
if(Form_obj.Seat_no.value.length==0) <b>1. Apache is an open source web
{ server</b><br/>
alert("Please,fill up the Seat Number"); <input type="radio" name="group1"
Form_obj.Seat_no.focus(); value="True">True
return false; <input type="radio" name="group1"
} value="False">False<br>
if(Form_obj.Name.value.length==0) <br/>
{
alert("Please,fill up the Name"); <b>2. In Modern PC there is no cache
Form_obj.Name.focus(); memory.</b><br/>
return false; <input type="radio" name="group2"
} value="True">True
return true; <input type="radio" name="group2"
} value="False">False<br>
</script> <br/>
</head>
<body bgcolor=lightgreen> <b>3. Tim-Berner Lee is the originator of
<center> Java.</b><br/>
<h1>OnLine Examination</h1> <input type="radio" name="group3"
</center> value="True">True
<form action="Exam.jsp" method="post" <input type="radio" name="group3"
value="False">False<br>
<br/>

<b>4.JPG is not a video file OUTPUT:


extension.</b><br/>
<input type="radio" name="group4"
value="True">True
<input type="radio" name="group4"
value="False">False<br>
<br/>

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


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

<center>
<input type = "submit" value="Submit">
<input type = "reset"
value="Clear"><br><br>
</center>
</form>
<%}%>
<tr>
<th>Name</th>
<th>Address</th>
Exp:7

SimpleXML.xml <th>Standard</th>
<?xml version="1.0" encoding="UTF-8"?> <th>Marks</th>
<?xml-stylesheet type="text/xsl" </tr>
href="SimpleXml.xsl"?> <xsl:for-each select="Student/Person-
<Student> Details">
<Person-Details> <tr>
<name>Anand</name> <td><xsl:value-of select="name"/></td>
<address>Pune</address> <td><xsl:value-of
<std>Second</std> select="address"/></td>
<marks>70 percent</marks> <td><xsl:value-of select="std"/></td>
</Person-Details> <td><xsl:value-of
<Person-Details> select="marks"/></td>
<name>Anuradha</name> </tr>
<address>Chennai</address> </xsl:for-each>
<std>Second</std> </table>
<marks>90 percent</marks> </body>
</Person-Details> </html>
<Person-Details> </xsl:template>
<name>Archana</name> </xsl:stylesheet>
<address>Mumbai</address>
<std>Forth</std>
<marks>80 percent</marks>
</Person-Details> OUTPUT:
<Person-Details>
<name>Monika</name>
<address>Delhi</address>
<std>Tenth</std>
<marks>77 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/T
ransform">
<xsl:template match="/">
<html>
<body>
<h2>Students Database</h2>
<table border="1">

You might also like