1. Ex.No: HTML PAGES WITH FRAMES, LINKS, TABLES
Date :
AIM:
To create a HTML pages with frames, links, tables and other tags.
ALGORITHM:
1. Create a HTML page using <table> tag which displays the content.
2. Create another HTML page using <OL>,<UL> and <LI> tags which displays the
content in the list format.
3. Create another HTML page with frames which combines more than one HTML
pages.
4. Execute the frame page, feel as dynamic page having more than one page in a
single page.
6. RESULT:
Thus the given program was coded and executed successfully.
7. Ex.No:02 HTML WITH INTERNAL AND EXTERNAL CSS
Date:
AIM:
To create a HTML page using internal and external CSS
ALGORITHM:
1. Create a simple HTML page.
2. Write internal CSS using <style> tag in the same page become internal CSS.
3. Create another CSS file using <style> tag with extension .css file, which becomes
external CSS file
4. Include the external CSS file in your file.
5. Find the style changes on your page.
PROGRAM:
int_ext_css.html
<!--- Internal and External CSS Example--->
<html>
<head>
<link rel="stylesheet" type="text/css" href="exter.css" />
<style>
h1
{
text-align:center;
}
h2
{
font-size:30px;
text-align:center;
}
h3
{
font-size:30px;
text-align:center;
}
a.three:link {color:#ff0000;}
a.three:visited {color:#0000ff;}
a.three:hover {background:#66ff66;}
a.three
{
10. OUTPUT:
RESULT:
Thus the given program was coded and executed successfully.
11. Ex.No: 3a
Date:
DATE COMPARISION USING JAVA SCRIPT
AIM:
To create a HTML page using java script to find difference between two dates
ALGORITHM:
1. Write a function using java script to set the date.
2. Write a function using java script to set the month.
3. Write a function using java script to find the difference between two dates.
4. Write another function to display all the details in your page.
5. Use appropriate tags to display the content on your page.s.
PROGRAM:
datediff.html
<HTML>
<HEAD>
<SCRIPT LANGUAGE=JavaScript>
function writeOptions(startNumber, endNumber)
{
var optionCounter;
for (optionCounter = startNumber; optionCounter <= endNumber;
optionCounter++)
{
document.write('<OPTION value=' + optionCounter + '>' +
optionCounter);
}
}
function writeMonthOptions()
{
var theMonth;
var monthCounter;
var theDate = new Date();
for (monthCounter = 0; monthCounter < 12; monthCounter++)
{
theDate.setMonth(monthCounter);
theMonth = theDate.toString();
theMonth = theMonth.substr(4,3);
document.write('<OPTION value=' + theMonth + '>' + theMonth);
12. }
}
function recalcDateDiff()
{
var myForm = document.form1;
var firstDay =
myForm.firstDay.options[myForm.firstDay.selectedIndex].value;
var secondDay =
myForm.secondDay.options[myForm.secondDay.selectedIndex].value;
var firstMonth =
myForm.firstMonth.options[myForm.firstMonth.selectedIndex].value;
var secondMonth =
myForm.secondMonth.options[myForm.secondMonth.selectedIndex].value;
var firstYear =
myForm.firstYear.options[myForm.firstYear.selectedIndex].value;
var secondYear =
myForm.secondYear.options[myForm.secondYear.selectedIndex].value;
var firstDate = new Date(firstDay + " " + firstMonth + " " + firstYear);
var secondDate = new Date(secondDay + " " + secondMonth + " " +
secondYear);
var daysDiff = (secondDate.valueOf() - firstDate.valueOf());
daysDiff = Math.floor(Math.abs((((daysDiff / 1000) / 60) / 60) / 24));
myForm.txtDays.value = daysDiff;
var age=daysDiff/365;
myForm.age1.value=Math.floor(age);
return true;
}
function window_onload()
{
var theForm = document.form1;
var nowDate = new Date();
theForm.firstDay.options[nowDate.getDate() - 1].selected = true;
theForm.secondDay.options[nowDate.getDate() - 1].selected = true;
theForm.firstMonth.options[nowDate.getMonth()].selected = true;
theForm.secondMonth.options[nowDate.getMonth()].selected = true;
theForm.firstYear.options[nowDate.getFullYear()- 1970].selected = true;
theForm.secondYear.options[nowDate.getFullYear() - 1970].selected =
true;
}
</SCRIPT>
</HEAD>
<BODY LANGUAGE="JavaScript" onload="return window_onload()">
14. writeOptions(1970,2010);
</SCRIPT>
</SELECT>
</P>
Total difference in days:
<INPUT TYPE="text" NAME="txtDays" VALUE="0" size="3">
<p>Your Age is:
<INPUT TYPE="text" NAME="age1" VALUE="0" size="2">
</p>
</FORM>
</BODY>
</HTML>
15. OUTPUT:
RESULT:
Thus the given program was coded and executed successfully.
16. Ex.No: 3b
Date:
FORM VALIDATION USING JAVA SCRIPT
AIM:
To write a program for form validation using java script.
ALGORITHM:
1. Design a page for signup form with rich user interface.
2. Write the java script function to validate all mandatory fields on your web page.
3. Validation should be done after the submit operation.
4. Use appropriate tags to display the contents.
5. Make sure the page is working efficiently.
PROGRAM:
signup.html
<html>
<head>
<title>Student Registration Form</title>
<script type="text/javascript">
<!--
function validate()
{
if(document.signup.fname.value=="")
{
alert("Please Enter First Name!");
return false;
}
if(document.signup.lname.value=="")
{
alert("Please Enter Last Name!");
return false;
}
if(document.signup.uname.value=="")
{
alert("Please Enter User Name!");
return false;
}
if(document.signup.pword1.value=="")
{
alert("Please Enter Password!");
return false;
}
20. OUTPUT:
RESULT:
Thus the given program was coded and executed successfully.
21. Ex.No:4
Date:
ONLINE BOOK SHOPPING USING JSP OBJECTS
AIM:
To write an online book shopping application using JSP objects.
ALGORITHM:
1. Create home, login, registration, profile, catalog and order html pages.
2. Create jsp pages which does all business works on the server.
3. Use appropriate database to store the details of the books.
4. Create tables to store login details and books details.
5. Connect the database using odbc.jdbc driver.
6. Make changes in the control settings to enable database on your local machine.
PROGRAM:
Main.html
<html>
<body bgcolor=”pink”>
<br><br><br><br><br><br>
<h1 align=”center”>>U>ONLINE BOOK STORAGE</u></h1><br><br><br>
<h2 align=”center”><PRE>
<b> Welcome to online book storage.
Press LOGIN if you are having id
Otherwise press REGISTRATION
</b></PRE></h2>
<br><br><pre>
<div align=”center”><a href=”/tr/login.html”>LOGIN</a>
href=”/tr/login.html”>REGISTRATION</a></div></pre>
</body></html>
Login.html
<html>
<body bgcolor=”pink”><br><br><br>
<form name="myform" method="post" action=/tr1/login.jsp">
<div align="center"><pre>
LOGIN ID : <input type="passwors" name="pwd"></pre><br><br>
PASSWORD : <input type="password" name="pwd"></pre><br><br>
</div>
<br><br>
<div align="center">
28. {
out.println(“SORRY INVALID ID TRY AGAIN ID <br><br>”);
out.println(“<a href=”/tr1/order.html”>press HERE to RETRY </a>”);
}
else
{
Statement stmt2=con.createStatement();
String s=”select cost from book where title=”+title+””;
ResultSet rs1=stmt2.executeQuery(s);
int flag1=0;
while(rs1.next())
{
flag1=1;
x=Integer.parseInt(rs1.getString(1));
amount=count*x;
out.println(“AMOUNT :”+amount+”<br><br><br><br>”);
Statement stmt1=con.createStatement ();
stmt1.executeUpdate(“insert into details
(“+id+”,”+title+”,”+amount+”,”+date+”,”+cno+”)”);
out.println (“YOU ORDER HAS TAKEN<br>”);
}
if(flag1==0)
{
out.println(“SORRY INVALID BOOK TRY AGAIN <br><br>”);
out.println(“<a href=”/tr1/order.html”>press HERE to RETRY </a>”);
}
} out.println (“</body></html>”);%>
31. RESULT:
Thus the given program was coded and executed successfully.
32. Ex.No:5
Date:
SIMPLE SERVLET PROGRAM
AIM:
To write a simple servlet program using HTTP in java.
ALGORITHM:
1. Create a servlet program using http.
2. Set classpath where servlet-api.jar file resides.
3. Compile the servlet program using javac programname.java
4. Place the class file …Tomcat 5.5webappsROOTWEB-INFclasses folder.
5. modify the web.xml file using your servletClassName.
6. Invoke the class file using http://localhost:8080/servetClassName from your
browser
PROGRAM:
CmsHome.java
import java.io.*;
import javax.servlet.*;
import javax.servlet.http.*;
public class mailamHome extends HttpServlet
{
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException,IOException
{
response.setContentType("text/html");
PrintWriter pw = response.getWriter();
pw.println("<html>");
pw.println("<head><title>Hello World</title></title>");
pw.println("<body>");
pw.println("<h1>CMS COLLEGE OF ENGINEERING</h1>");
pw.println("<h2>An ISO 9001:2000 Certified Institution</h2>");
pw.println("<h3>Affliated to Anna University</h3>");
pw.println("</body></html>");
}
}
web.xml
<?xml version="1.0" encoding="ISO-8859-1"?>
<!--<!DOCTYPE web-app
PUBLIC "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN"
"http://java.sun.com/dtd/web-app_2_3.dtd"> -->
34. OUTPUT:
RESULT:
Thus the given program was coded and executed successfully.
35. Ex.No:06
Date:
STUDENT INFORMATION SYTEM USING JSP AND SERVLET
AIM:
To develop the student webpage information using java servlet and
JDBC.
ALGORITHM :
1. Start the program
2. Create main HTML page for student database maintenance
3. Select option to do the following operation
4. Insertion, search ,delete and modify or update the student recode
Main.html
<html>
<body bgcolor=yellow text=red>
<div align=center>
<label><h2>Student database maintenance</h2> </label>
<TABLE>
<TR><TD><a
href="http://localhost:7001/student/register.html">REGISTER</a></TD></T
R>
<TR><TD><a
href="http://localhost:7001/student/find3">SEARCH</a></TD></TR>
<TR><TD><a href="http://localhost:7001/student/viewall">VIEW ALL
</a></TD></TR>
<TR><TD><a
href="http://localhost:7001/student/delete2.html">DELETE</a></TD></TR>
<!--<TR><TD><a
href="http://localhost:7001/student/update">UPDATE</a></TD></TR>-->
</table>
</div></body></html>
Register.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> registration </TITLE>
</HEAD>
<BODY bgcolor=teak text=red>
<form action="http://localhost:7001/student/register1" method=post>
<pre>
36. Enter Id : <input type=text name="id" size=4 ><br>
Enter Name : <input type=text name="name" size=20 ><br>
Enter Age : <input type=text name="age" size=4 ><br>
Enter Branch: <input type=text name="branch" size=10 ><br>
Enter Mark1 : <input type=text name="m1" size=4 ><br>
Enter Mark2 : <input type=text name="m2" size=4 ><br>
Enter Mark3 : <input type=text name="m3" size=4 ><br>
Enter Grade : <input type=text name="grade" size=20 ><br>
Click : <input type="submit" name="submit" value=register>
</pre></form></BODY></HTML>
Insert.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> registration </TITLE>
</HEAD>
<BODY bgcolor=teak text=red>
<form action="http://localhost:7001/student/insert" method=post>
<pre>
<div align=center>
Enter Id : <input type=text name="id" size=4 ><br>
Enter Name : <input type=text name="name" size=20 ><br>
Enter Age : <input type=text name="age" size=4 ><br>
Enter Branch: <input type=text name="branch" size=10 ><br>
Enter Mark1 : <input type=text name="m1" size=4 ><br>
Enter Mark2 : <input type=text name="m2" size=4 ><br>
Enter Mark3 : <input type=text name="m3" size=4 ><br>
Enter Grade : <input type=text name="grade" size=4 ><br>
<input type="submit" name="submit" value=register>
</div></pre></form></BODY></HTML>
Delete.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> DELETE STUDENT RECORD </TITLE></HEAD>
<BODY bgcolor=yellow text=cyan>
<form action="http://localhost:7001/student/delete2" method=post>
<pre>
Enter the ID :<input type=text name="idno" size=4 ><br>
Click :<input type="submit" name=submit value=delete>
</pre>
</form>
37. </BODY>
</HTML>
Second.java
import java.io.*;
import javax.servlet.*;
import javax.servlet.http.*;
import java.sql.*;
import java.lang.*;
public class second extends HttpServlet
{
public void doGet(HttpServletRequest req,HttpServletResponse
res)throws ServletException,IOException
{
loginform(res,false);
}//goGet()
private void loginform(HttpServletResponse res,boolean error)throws
ServletException,IOException
{
res.setContentType("text/html");
PrintWriter pr=res.getWriter();
pr.println("<html><body bgcolor=blue text=red>");
pr.println("<div align=center>");
if(error)
{
pr.println("<H2>LOGIN FAILED, PLEASE TRY
AGAIN!!!</H2>");
}
pr.println("<form method=post NAME=FORM>");
pr.println("<table><TR><TD><label> please enter your name
and password</label></TR></TD>");
pr.println("<TR><TD>Username:<input type=text
name=username> ");
pr.println("<TR><TD>Password:<input type=password
name=password><br></TR></TD><hr width=100%></TR></TD>");
pr.println("<TR><TD>Press:<input type=submit name=submit
value=Continue></TR></TD>");
pr.println("<TR><TD>clear:<input type=reset name =reset
value=Clear></TR></TD></TABLE>");
pr.println("</form></div></body></html>");
}//loginform()
public void doPost(HttpServletRequest req,HttpServletResponse
res)throws ServletException,IOException
{
String name=req.getParameter("username");
String pass=req.getParameter("password");
47. RESULT :
Thus student information java script program is successfully completed.
48. Ex.No:07
Date:
SIMPLE XML DOCUMENT FOR CD SHOP
AIM:
To create a XML document for the CD-Store.
ALGORITHM:
1. Create the XML document using <?xml version="1.0" encoding="ISO-8859-1"?
> tag as the initial tab.
2. Create another CSS document which displays the xml document details into
HTML format on the browser.
3. Give appropriate style in the CSS document.
4. Invoke xml file from your browser.
PROGRAM:
cd_catalog_css.xml
<?xml version="1.0" encoding="ISO-8859-1"?>
<!-- Edited by XMLSpy® -->
<?xml-stylesheet type="text/css" href="cd_catalog.css"?>
<CATALOG>
<CD>
<TITLE>Empire Burlesque</TITLE>
<ARTIST>Bob Dylan</ARTIST>
<COUNTRY>USA</COUNTRY>
<COMPANY>Columbia</COMPANY>
<PRICE>10.90</PRICE>
<YEAR>1985</YEAR>
</CD>
<CD>
<TITLE>Hide your heart</TITLE>
<ARTIST>Bonnie Tyler</ARTIST>
<COUNTRY>UK</COUNTRY>
<COMPANY>CBS Records</COMPANY>
<PRICE>9.90</PRICE>
<YEAR>1988</YEAR>
</CD>
<CD>
<TITLE>Greatest Hits</TITLE>
<ARTIST>Dolly Parton</ARTIST>
<COUNTRY>USA</COUNTRY>
<COMPANY>RCA</COMPANY>
<PRICE>9.90</PRICE>
<YEAR>1982</YEAR>
54. OUTPUT:
RESULT:
Thus the given program was coded and executed successfully.
55. Ex.No:08
Date:
SIMPLE XML DOCUMENT WITH DTD
AIM:
To write a DTD for a domain specific XML document to validate the XML file.
ALGORITHM:
1. Start the program
2. Open an XML file as note.xml, to create detail using
3. Various xml attribute list
4. Using user defined tags, we can create message.
5. Using an external and internaldtd,we create elementlist as #PCDATA for retrieve
the datafield
6. Using attribute declaration ,use to retrieve the datafield as more than one time
7. Execute the program
PROGRAM:
note.xml
<?xml version="1.0" ?>
<!DOCTYPE note [
<!ELEMENT note (to,from,heading,body)>
<!ELEMENT to (#PCDATA)>
<!ELEMENT from (#PCDATA)>
<!ELEMENT heading (#PCDATA)>
<!ELEMENT body (#PCDATA)>
]>
<note>
<to>Tove</to>
<from>Jani</from>
<heading>Reminder</heading>
<message>Don't forget me this weekend!</message>
</note>
dom.xml
<html>
<body>
<h1>Mailam Engineering Collge</h1>
<p><b>To:</b> <span id="to"></span><br />
<b>From:</b> <span id="from"></span><br />
<b>Message:</b> <span id="message"></span>
</p>
<script type="text/javascript">
58. RESULT:
Thus the given program was coded and executed successfully.
59. Ex.No:09
Date:
PARSING AN XML DOCUMENT USING DOM AND SAX PARSERS.
AIM:
To Parsing an XML document using DOM and SAX Parsers.
ALGORITHM :
Using Dom:
1. Get a document builder using document builder factory and
parse the xml file to create a DOM object
2. Get a list of employee elements from the DOM
3. For each employee element get the id, name, age and type.
Create an employee value object and add it to the list.
4. At the end iterate through the list and print the employees to
verify we parsed it right.
Using Sax:
1. Create a Sax parser and parse the xml
2. In the event handler create the employee object
3. Print out the data
PROGRAM:
employees.xml
<?xml version="1.0" encoding="UTF-8"?>
<Personnel>
<Employee type="permanent">
<Name>Seagull</Name>
<Id>3674</Id>
<Age>34</Age>
</Employee>
<Employee type="contract">
<Name>Robin</Name>
<Id>3675</Id>
<Age>25</Age>
</Employee>
<Employee type="permanent">
<Name>Crow</Name>
<Id>3676</Id>
<Age>28</Age>
</Employee>
</Personnel>
Using DOM
DomParserExample.java
60. a) Getting a document builder
private void parseXmlFile(){
DocumentBuilderFactory dbf =
DocumentBuilderFactory.newInstance();
try {
DocumentBuilder db = dbf.newDocumentBuilder();
XML file
dom = db.parse("employees.xml");
}catch(ParserConfigurationException pce) {
pce.printStackTrace();
}catch(SAXException se) {
se.printStackTrace();
}catch(IOException ioe) {
ioe.printStackTrace();
}
}
b) Get a list of employee elements
Get the rootElement from the DOM object.From the root element get all
employee elements. Iterate through each employee element to load the data.
private void parseDocument(){
Element docEle = dom.getDocumentElement();
NodeList nl = docEle.getElementsByTagName("Employee");
if(nl != null && nl.getLength() > 0) {
for(int i = 0 ; i < nl.getLength();i++) {
Element el = (Element)nl.item(i);
Employee e = getEmployee(el);
myEmpls.add(e);
}
}
}
c) Reading in data from each employee.
private Employee getEmployee(Element empEl) {
String name = getTextValue(empEl,"Name");
int id = getIntValue(empEl,"Id");
int age = getIntValue(empEl,"Age");
String type = empEl.getAttribute("type");
Employee e = new Employee(name,id,age,type);
return e;
}
private String getTextValue(Element ele, String tagName) {
String textVal = null;
NodeList nl = ele.getElementsByTagName(tagName);
61. if(nl != null && nl.getLength() > 0) {
Element el = (Element)nl.item(0);
textVal = el.getFirstChild().getNodeValue();
}
return textVal;
}
private int getIntValue(Element ele, String tagName) {
return Integer.parseInt(getTextValue(ele,tagName));
}
d) Iterating and printing.
private void printData(){
System.out.println("No of Employees '" + myEmpls.size() +
"'.");
Iterator it = myEmpls.iterator();
while(it.hasNext()) {
System.out.println(it.next().toString());
}
}
Using Sax:
SAXParserExample.java
a) Create a Sax Parser and parse the xml
private void parseDocument() {
SAXParserFactory spf = SAXParserFactory.newInstance();
try {
SAXParser sp = spf.newSAXParser();
sp.parse("employees.xml", this);
}catch(SAXException se) {
se.printStackTrace();
}catch(ParserConfigurationException pce) {
pce.printStackTrace();
}catch (IOException ie) {
ie.printStackTrace();
}
}
b) In the event handlers create the Employee object and call the corresponding setter
methods.
public void startElement(String uri, String localName, String
qName,
Attributes attributes) throws SAXException
{
tempVal = "";
if(qName.equalsIgnoreCase("Employee"))
62. {
tempEmp = new Employee();
tempEmp.setType(attributes.getValue("type"));
}
}
public void characters(char[] ch, int start, int length) throws
SAXException {
tempVal = new String(ch,start,length);
}
public void endElement(String uri, String localName,
String qName) throws SAXException
{
if(qName.equalsIgnoreCase("Employee"))
{
myEmpls.add(tempEmp);
}
else if (qName.equalsIgnoreCase("Name"))
{
tempEmp.setName(tempVal);
}
else if (qName.equalsIgnoreCase("Id"))
{
tempEmp.setId(Integer.parseInt(tempVal));
}
else if (qName.equalsIgnoreCase("Age"))
{
tempEmp.setAge(Integer.parseInt(tempVal));
}
}
c) Iterating and printing.
private void printData(){
System.out.println("No of Employees '" + myEmpls.size() +
"'.");
Iterator it = myEmpls.iterator();
while(it.hasNext()) {
System.out.println(it.next().toString());
}
}
63. OUTPUT:
Employee Details - Name:Seagull, Type:permanent, Id:3674, Age:34.
Employee Details - Name:Robin, Type:contract, Id:3675, Age:25.
Employee Details - Name:Crow, Type:permanent, Id:3676, Age:28.
RESULT:
Thus the Parsing an XML document using DOM and SAX Parsers is been done
and executed successfully.
64. Ex.No:10
Date:
SAMPLE WEB APPLICATION DEVELOPMENT IN THE OPEN
SOURCE ENVIRONMENT WITH DATABASE ACCESS
AIM:
To create Sample web application development in the open source
environment.
ALGORITHM :
1. start the program
2. Inside the asp definiton tag include the html contents
3. include the code for the database connectivity using the ado object
4. select all the datas form the student table
5. Traverse all the tuples in the table
6. Print the datas
7. close the connection
8. stop the program
PROGRAM:
access.asp
<% Option Explicit %>
<html>
<% DIM name
set con=Server.CreateObject("ADODB.Connection">
con.open "dsn=cse;"
set rs=Server.Createobject("ADODB.RecordSet")
set rs=con.Execute("select * from student where name="&name&")%>
<table border="," width="50"%>
<% while NOT rs.EOF %>
<tr><% for t=0 to 6 %>
<td><% Response.write(rs(i)) %>
<% NEXT %></td></tr>
<% Move Next wend %></table>
<%con.close%>
</html>
stuaccess.html
<html>
<form action="access.asp" method="post">
Name<input type="text" name="Name"><br><br>
<input type="submit">
<input type="reset">
65. </form></html>
OUTPUT:
RESULT :
Thus the Sample web application development in the open source nvironment
has been executed successfully executed.