NATCHATRAN -PREM ANANDH.J: CS67 - Internet Programming Lab Manual

Ex :no 1 College Website design

PROGRAM:

Home.html

<html>

<head>

<title>JPCOE</title>

</head>

<center><h1><font face="stencil" color="yellow">NATCHATRAN ENGINEERING COLLEGE</h1>

<h7>Ayikudi,Tenkasi</h7></font>

<font face="stencil" color="Red"><h4>THIRUNELVELI</h4></font>

</center>

<hr>

<p>

<a href="facilities.html">Facilities</a>

<a href="courses.html">Courses</a>

<a href="gallery.html">Gallery</a>

<a href="contactus.html">Contact us</a>

</center>

</font>

</p>

<hr><h2><font face="stencil" color="white">Welcome to JPCOE</h2>

<br>

Be the Best....

<br>

</body>

</html>

Facilities .html

<html>

<head>

<title>JPCOE</title>

</head>

<body>

<center><h1><font face="stencil" color="yellow"> NATCHATRAN ENGINEERING COLLEGE </font></h1>

<font face="stencil" color="Red"><h4>THIRUNELVELI</h4></font>

</center>

<hr>

<p>

<a href="facilities.html">Facilities</a>

<a href="courses.html">courses</a>

<a href="gallery.html">gallery</a>

<a href="contactus.html">contact us</a>

</center>

</font>

</p>

<hr><h2><font face="stencil" color="white"><br>FACILITIES<br></h2></font>

<br>

<li>Excellent infrastructure

<li>Experienced Staff members

<li>Well Equpied lab

<li>ATM center

<li>Separate hostel for boys4 and girls

<li>English language lab

<li>Transport facility to varies Places

</ul>

</body>

</html>

Gallery.html

<html>

<head>

<title>JPCOE</title>

</head>

<body>

<center><h1><font face="stencil" color="yellow"> NATCHATRAN ENGINEERING COLLEGE </font></h1>

<font face="stencil" color="Red"><h4>THIRUNELVELI</h4></font>

</center>

<hr>

<p>

<a href="facilities.html">Facilities</a>

<a href="courses.html">courses</a>

<a href="gallery.html">gallery</a>

<a href="contactus.html">contact us</a>

</center>

</font>

</p>

<hr><h2><font face="stencil" color="white"><br>PHOTO GALLERY<br></h2></font>

<br>

</center>

</body>

</html>

Courses.html

<html>

<head>

<title>JPCOE</title>

</head>

<center><h1><font face="stencil" color="yellow"> NATCHATRAN ENGINEERING COLLEGE </font></h1>

<font face="stencil" color="Red"><h4>THIRUNELVELI</h4></font>

</center>

<hr>

<p>

<a href="facilities.html">Facilities</a>

<a href="courses.html">courses</a>

<a href="gallery.html">gallery</a>

<a href="contactus.html">contact us</a>

</center>

</font>

</p>

<h1><font face="Arial Black" color="blue">COURSES</h1></font>

<h3>

<ol>

<li>CSE

<li>ECE

<li>IT

<li>EEE

<li>MECH

</ol>

</h3>

</font>

<h3>

<ol>

<li>Network Engg.

<li>VLSI

</ol>

<h3>

</font>

</body>

</html>

contactus.html

<html>

<head>

<title>JPCOE</title>

</head>

<center><h1><font face="stencil" color="yellow"> NATCHATRAN ENGINEERING COLLEGE </font></h1>

<font face="stencil" color="Red"><h4>THIRUNELVELI</h4></font>

</center>

<hr>

<p>

<a href="facilities.html">Facilities</a>

<a href="courses.html">courses</a>

<a href="gallery.html">gallery</a>

<a href="contact us.html">contact us</a>

</center>

</font>

</p>

<hr><h2><font face="Comic Sans MS" color="white">Contact us</h2>

<br>

<Address>Jp colege of Engineering<br>College Road<br>Ayikudi<br>Tenkasi<br>Ph No: 123456 <br><br>mail us to info@jpcoe.org<br></Address>

<br>

</body>

</html>

Ex :no 2 Creation of image map

PROGRAM:

Imagemap.html

<html>

<head><title>Image Map -

India

</title></head>

<body>

<center><b><h4>Image Map -

India

</h4></b>

<img src="india_map.jpg" usemap="#

india

map">

</map>

</center>

<p><b>Note:</b> Click the hot spot to get the details of metro cities</p>

</body>

</html>

chennai.html

<html>

<head>

<title>CHENNAI</title>

</head>

<center><font color="orange"size=4 face="lucida calligraphy">CHENNAI DETAILS</font></center>

<u><font color="yellow"size=4 face="arial">DESCRIPTION</font></u>

<li>chennai is a capital of tamilnadu

<li>chennai is a big city of tamilnadu

</body>

</html>

delhi.html

<html>

<head>

<title>DELHI</title>

</head>

<center><font color="black" size="5" face="lucida calligraphy">DELHI</font></center>

<font color="orange" size="4" face="arial">DESCRPTION</font><br>

<font color="white" size="3" face="monotype corsiva">DELHI IS A CAPITAL OF INDIA.<br>

DELHI IS A BEAUTYFULL PLACE.</font>

</body>

</html>

kolkatta.html

<html>

<head>

<title>KOLKATTA</title>

</head>

<center><font color="black" size="5" face="lucida calligraphy">KOLKATTA</font></center>

<font color="orange" size="4" face="arial">DESCRPTION</font><br>

<font color="white" size="3" face="monotype corsiva">KOLKATTA IS A CAPITAL OF WEST BENGAL.<br>

KOLKATTA IS A HOTEST CITY.</font>

</body>

</html>

mumbai.html

<html>

<head>

<title>MUMBAI</title>

</head>

<center><font color="black" size="5" face="lucida calligraphy">MUMBAI</font></center>

<font color="orange" size="4" face="arial">DESCRPTION</font><br>

<font color="white" size="3" face="monotype corsiva">MUMBAI IS A CAPITAL OF MAHARASTRA.<br>

MUMBAI IS A BIG CITY.</font>

</body>

</html>

Ex: 3 Creation of Embedded style sheets

PROGRAM:

EmbeddedCSS.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml11.dtd">

<head> <title>Embedded style sheet</title>

{

font-family:Arial;

color:green

}

h2 {

font-family:Arial;

color:red;

left:20px

}

h3{

font-family:arial;

color:blue;

}

font-size:14pt;

font-family:verdana

}

#mystyle1

{

font-family:Comic Sans MS;

color:yellow;

font-size:15

}

</style>

</head>

<body>

<h1>

<center> This page is created using Embedded Style Sheet </center>

</h1>

<h2>

This line is aligned left and red colored.

</h2>

<p> The embedded style sheet is the most commonly used style sheet. This paragraph is written in Verdana font with font size of 14. </p>

<h3> This is a blue <a href=”colorname.html”>colored</a> line. </h3>

</body>

</html>

Ex: 4 Creation of External style sheets

PROGRAM:

Ex4CSS.css

{

font-family:Arial

}

{

font-family:times new roman;

color:red;

left:20px

}

{

font-family:arial;

color:blue;

}

{

font-size:14pt;

font-family:Monotype Corsiva

}

Ex4CSS.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml11.dtd">

<head>

</head>

<body>

<h1 class="special"> <center> This page is created using External Style

Sheet</center> </h1>

<h2>

This line is aligned left and red colored.

</h2>

<p>The External style sheet is the compact representation of Cascading Style Sheets.

This paragraph is written in Monotype Corsiva font with font size of 14. </p>

<h3>

This is a blue <a href=”colorname.html”>colored</a> line.

</h3>

</body>

</html>

Ex:5 Validating Web Form Controls using DHTML

PROGRAM:

ApplicationForm.html

<html>

<head>

<title>The Student Registration Form</title>

function validate()

{

var i;

var name_str=document.my_form.name;

var phoneID=document.my_form.ph_txt;

var 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 the 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;

}

var index_at=str.indexOf("@");

var len=str.length;

var index_dot=str.indexOf(".");

var emailID=document.my_form.Email_txt;

if ((emailID.value==null)||(emailID.value==""))

{

alert("Please Enter your Email ID");

emailID.focus();

return false;

}

if (str.indexOf("@")==-1)

{

alert("Invalid E-mail ID");

return false;

}

if (str.indexOf(".")==-1 || str.indexOf(".")==0 || str.indexOf(".")==index_at)

{

alert("Invalid E-mail ID");

return false;

}

if (str.indexOf("@",(index_at+1))!=-1)

{

alert("Invalid E-mail ID");

return false;

}

if (str.indexOf(" ")!=-1)

{

alert("Invalid E-mail ID");

return false;

}

if (!document.my_form.group1[0].checked && !document.my_form.group1[1].checked)

{

alert("Please Select Sex");

return false;

}

alert("Registered Successfully");

return true;

}

</script>

</head>

<center><h3>Application Form</h3></center>

<strong>Phone No:&nbsp</strong>

<strong>Email:&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp</strong>

<input type="radio" name="group1" value="Male">Male&nbsp&nbsp&nbsp&nbsp

<input type="radio" name="group1" value="Female">Female<br/><br/><br/>

<strong>Hoby: </strong> &nbsp&nbsp

<input type="checkbox" name ="option1" value="Singing">Singing<br/>

&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp

<input type="checkbox" name ="option1" value="Reading">Reading<br/>

&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp

<input type="checkbox" name ="option1" value="T.V.">Watching T.V<br/>

<strong>Country:</strong>

<option value="India">India</option>

<option value="China">China</option>

<option value="Nepal">Nepal</option>

</select>

</center>

</form>

</body>

</html>

Ex:6 Creation of Color palette

PROGRAM:

ColorPalette.java

// Ex:6 Creation of Color palette

import java.awt.*;

import java.awt.event.*;

import java.applet.*;

/*<applet code="ColorPalette" width=400 height=400>

</applet>*/

public class ColorPalette extends Applet implements ItemListener

{

int currcolor=5;

int flag=1;

String text="Click any of the buttons";

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);

buttons[3].setBackground(Color.yellow);

buttons[4].setBackground(Color.magenta);

add(box1);

add(box2);

add(box3);

box1.addItemListener(this);

box2.addItemListener(this);

box3.addItemListener(this);

}

public void itemStateChanged(ItemEvent ev)

{

if(box1.getState()==true)

flag=1;

else if(box2.getState()==true)

{

text="Default color is black";

flag=2;

}

else if(box3.getState()==true)

{

img=getImage(getDocumentBase(),"prem.jpg");

flag=3;

}

repaint();

}

public void paint(Graphics g)

{

if(flag==2)

{

g.drawString(text,30,100);

switch(currcolor)

{

case 0:

g.setColor(Color.red);

break;

case 1:

g.setColor(Color.blue);

break;

case 2:

g.setColor(Color.green);

break;

case 3:

g.setColor(Color.yellow);

break;

case 4:

g.setColor(Color.magenta);

break;

case 5:

g.setColor(Color.black);

break;

}

g.drawString(text,30,100);

}

else if(flag==1)

{

g.drawString(text,30,100);

switch(currcolor)

{

case 0:

setBackground(Color.red);

break;

case 1:

setBackground(Color.blue);

break;

case 2:

setBackground(Color.green);

break;

case 3:

setBackground(Color.yellow);

break;

case 4:

setBackground(Color.magenta);

break;

case 5:

setBackground(Color.white);

break;

}

else if(flag==3)

{

g.drawImage(img,20,90,this);

}

public boolean action(Event e,Object o)

{

for(int i=0;i<5;i++)

{

if(e.target==buttons[i])

{

currcolor=i;

text="You have chosen "+colours[i];

repaint();

return true;

}

return false;

}

OUTPUT:

C:\jdk1.6.0_05\bin>javac ColorPalette.java

C:\jdk1.6.0_05\bin>appletviewer ColorPalette.java

Ex: 7 Creation of Java Servlet

PROGRAM:

ex7servlet.java

// Ex: 7 Creation of Java Servlet

import java.io.*;

import java.util.*;

import javax.servlet.*;

import java.net.*;

import javax.servlet.http.*;

public class ex7servlet extends GenericServlet

{

public void service(ServletRequest req,ServletResponse res) throws ServletException,IOException

{

PrintWriter out=res.getWriter();

Enumeration en=req.getParameterNames();

out.println("Student Details\n");

while(en.hasMoreElements())

{

String name_received=(String)en.nextElement();

out.print(name_received+ " = ");

String value_received=req.getParameter(name_received);

out.println(value_received);

out.println(" ");

}

out.close();

}

invokeServlet.html

<html>

<head>

<title>Student Information Form</title>

</head>

<body>

<form name="form1"

action="http://localhost:8084/Ex7_Servlet/ex7servlet">

<h3>Enter student information in following fields -</h3>

<table>

<tr>

<td><b>Roll Number</b></td>

</tr>

<tr>

<td><b>Student Name</b></td>

</tr>

<tr>

<td><b>Student Address</b></td>

</tr>

<tr>

<td><b>Phone</td>

</tr>

<tr>

<td><b>Total Marks</td>

</tr>

</table>

</form>

</center>

</body>

</html>

Ex: 8. Simple XML Document using XSL

PROGRAM:

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>

<th>Address</th>

<th>Standard</th>

<th>Marks</th>

</tr>

<xsl:for-each select="Student/Person-Details">

</tr>

</xsl:for-each>

</table>

</body>

</html>

</xsl:template>

</xsl:stylesheet>

SimpleXml.xml

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

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

<Person-Details>

<marks>85 percent</marks>

</Person-Details>

<Person-Details>

<name>Naren</name>

<address>Chennai</address>

<marks>90 percent</marks>

</Person-Details>

<Person-Details>

<name>Varun</name>

<address>Mumbai</address>

<marks>80 percent</marks>

</Person-Details>

<Person-Details>

<name>Nithya</name>

<address>Delhi</address>

<marks>77 percent</marks>

</Person-Details>

</Student>

Ex: 9. Web Programming using AJAX

PROGRAM:

Index.html

<html>

<head>

var XMLHttpRequestObject = false;

if (window.XMLHttpRequest)

{

XMLHttpRequestObject = new XMLHttpRequest();

}

else if (window.ActiveXObject)

{

XMLHttpRequestObject = new ActiveXObject("Microsoft.XMLHTTP");

}

function getData(dataSource, divID)

{

if(XMLHttpRequestObject)

{

var obj = document.getElementById(divID);

XMLHttpRequestObject.open("GET", dataSource);

XMLHttpRequestObject.onreadystatechange = function()

{

if (XMLHttpRequestObject.readyState == 4 && XMLHttpRequestObject.status == 200)

{

obj.innerHTML = XMLHttpRequestObject.responseText;

}

XMLHttpRequestObject.send(null);

}

</script>

</head>

<body>

<h1> Fetching data with Ajax </h1>

<form>

</form>

<p>The fetched data will go here.</p>

</div>

</body>

</html>

Data.txt

This is the new data

Ex: 10. On-line Examination using JSP

PROGRAM

index.jsp

<%@page contentType="text/html"%>

<%@page pageEncoding="UTF-8"%>

<html>

<head>

<title>Online Examination</title>

function validation(Form_obj)

{

if(Form_obj.Seat_no.value.length==0)

{

alert("Please,fill up the Seat Number");

Form_obj.Seat_no.focus();

return false;

}

if(Form_obj.Name.value.length==0)

{

alert("Please,fill up the Name");

Form_obj.Name.focus();

return false;

}

return true;

}

</script>

</head>

<h1>NATCHATRAN ENGINEERING COLLEGE</h1>

<h2>OnLine Examination - Web Technology</h2>

</center>

<strong>Seat Number:</strong><input type="text" name="Seat_no"><br><br>

<b>Total Marks:10(5*2=10) </b>       <b>Time: 15 Min.</b>

<hr/>

<b>1. Apache is an open source web server</b><br/>

<input type="radio" name="group1" value="True">True

<input type="radio" name="group1" value="False">False<br>

<br/>

<b>2. In Modern PC there is no cache memory.</b><br/>

<input type="radio" name="group2" value="True">True

<input type="radio" name="group2" value="False">False<br>

<br/>

<b>3. Tim-Berner Lee is the originator of Java.</b><br/>

<input type="radio" name="group3" value="True">True

<input type="radio" name="group3" value="False">False<br>

<br/>

<b>4.JPG is not a video file extension.</b><br/>

<input type="radio" name="group4" value="True">True

<input type="radio" name="group4" value="False">False<br>

<br/>

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

<input type="radio" name="group5" value="True">True

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

<hr/>

</center>

</form>

</body>

</html>

Exam.jsp

<%@ page language="java" import="java.sql.*" %>

<%@ page import="java.io.*" %>

<%@ page import="java.util.*" %>

String SeatNum,Name;

String ans1,ans2,ans3,ans4,ans5;

int a1,a2,a3,a4,a5;

a1=a2=a3=a4=a5=0;

Connection connect;

Statement stmt;

ResultSet rs;

Class.forName("sun.jdbc.odbc.JdbcOdbcDriver");

String url = "jdbc:odbc:StudentDB1";

connect = DriverManager.getConnection(url, " ", " ");

SeatNum = request.getParameter("Seat_no");

Name = request.getParameter("Name");

ans1 =request.getParameter("group1");

if(ans1.equals("True"))

a1=2;

else

a1=0;

ans2 = request.getParameter("group2");

if(ans2.equals("True"))

a2=0;

else

a2=2;

ans3 = request.getParameter("group3");

if(ans3.equals("True"))

a3=0;

else

a3=2;

ans4 = request.getParameter("group4");

if(ans4.equals("True"))

a4=2;

else

a4=0;

ans5 = request.getParameter("group5");

if(ans5.equals("True"))

a5=0;

else

a5=2;

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

stmt = connect.createStatement();

String query = "INSERT INTO StudentTable (" + "Seat_no,Name,Marks" + ") VALUES ('" +SeatNum + "', '" + Name + "', '"+Total+ "')";

int result = stmt.executeUpdate(query);

stmt.close();

stmt = connect.createStatement();

query = "SELECT * FROM StudentTable WHERE Name="+"'"+Name+"'";

rs = stmt.executeQuery(query);

<html>

<head><title>Student Mark List</title></head>

<h2>Students Marksheet</h2>

<h3>Name of the College:NATCHATRAN ENGINEERING COLLEGE</h3>

<h4>Department:CSE</h4>

<tr>

<td><b>Marks</b></td>

</tr>

while(rs.next())

{

<tr>

</tr>

}

rs.close();

stmt.close();

connect.close();

</table>

</center>

<b>Signature: <strike>prem</strike> <b><br/><br/>

<a href="http://localhost:8084/onlineExam/index.jsp">Click here to go back</a>

</body>

</html>

Natchatran

Friday, December 27, 2013

CS67 - Internet Programming Lab Manual

No comments: