Scribd
Upload
47 views

Web Technology Lab Manual

The documents provide code snippets and examples for various programming concepts like Fibonacci series, palindrome number checking, form validation, event handling, dropdown list manipulation, image display, name display in JSP, prime number checking, login forwarding, XML parsing and more. The code snippets contain HTML, JavaScript, JSP and C# code.

Uploaded by

ganga
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
47 views

Web Technology Lab Manual

The documents provide code snippets and examples for various programming concepts like Fibonacci series, palindrome number checking, form validation, event handling, dropdown list manipulation, image display, name display in JSP, prime number checking, login forwarding, XML parsing and more. The code snippets contain HTML, JavaScript, JSP and C# code.

Uploaded by

ganga
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 37

FIBONACCI SERIES

<html>
<head>
<title>Fibonacci Series</title>
</head>
<body>
<script type="text/javascript">
var a=0, b=1, c;
var num=prompt("Enter the limit to generate fibonacci number",0);
document.write(a+"<br/>");
document.write(b+"<br/>");
for(var i=3;i<=num;i++)
{
c=a+b;
a=b;
b=c;
document.write(c+"<br/>");
}
</script>
</body>
</html>
Output:
PALINDROME NUMBER

<html>
<head>
<title>Palindrome Number</title>
<script>
function palin()
{
var a,no,b,temp=0;
no=Number(document.getElementById("nnn").value);
b=no;
while(no>0)
{
a=no%10;
no=parseInt(no/10);
temp=temp*10+a;
}
if(temp==b)
{
alert("Palindrome Number");
}
else
{
alert("Not Palindrome Number");
}
}
</script>
<body>
Enter any Number:<input id="nnn">
<button onclick="palin()">Check</button><br/><br/>
</body>
</html>
Output:
FORM VALIDATION
program3.html
<html>
<head>
<title>Form Validation</title>
<script type="text/javascript">
function validate()
{
if(document.myform.name.value=="")
{
alert("Please provide your name!");
document.myform.name.focus();
return false;
}
if(document.myform.email.value=="")
{
alert("Please provide your email!");
document.myform.email.focus();
return false;
}
if(document.myform.email.value.indexOf("@",0)<0)
{
alert("Please provide valid email address!");
document.myform.email.focus();
return false;
}
if(document.myform.email.value.indexOf(".",0)<0)
{
alert("Please provide valid email address!");
document.myform.email.focus();
return false;
}
if(document.myform.pin.value==""||isNaN(document.myform.pin.value)||document.myform.
pin.value.length!=6)
{
alert("Please provide a pincode in the format ######");
document.myform.pin.focus();
return false;
}
if(document.myform.city.value==" ")
{
alert("Please provide your city name!");
document.myform.city.focus();
return false;
}
if(document.myform.country.value=="-1")
{
alert("Please provide your country!");
return false;
}
return(true);
}
</script>
</head>
<body>
<form action="program3a.html" name="myform" onsubmit="return(validate()));">
Name:<input type="text" name="name" size="10"/></br>
Email:<input type="text" name="email" size="20"/></br>
Pincode:<input type="text" name="pin" size="10"/></br>
City:<input type="text" name="city" size="15"/></br>
Country:<select name="country">
<option>India</option>
<option>USA</option>
<option>China</option>
<option>Japan</option>
</select></br>
<input type="submit" value="submit" onclick="validate()"/>
<input type="reset" name="s2" value="Reset"/></br>
</form>
</body>
</html>

program3a.html
<html>
<body>
<h2>Form Successfully Submitted</h2>
</body>
</hmtl>

Output:
POPUP WINDOW
<html>
<head>
<script>
function newWindow(url)
{
popupWindow=window.open(url,'popupWindow','height=300,width=450,left=100,top=100,r
esizable=yes,toolbar=yes,member=no,location=np,direction=no,status=yes');
}
function closeWindow()
{
if(false==popupWindow.closed)
{
popupWindow.close();
}
else
{
alert('That window is already closed. Open the window first and try again!');
}
}
</script>
</head>
<body>
<button onclick="javascript:newWindow('penguins.jpg')">Open Popup Window</button>
<button onclick="javascript:closeWindow">Close Popup Window</button>
</body>
</hmtl>
Output:
EVENT HANDLER
<html>
<head>
<script>
function myFunction()
{
var x=document.getElementById("fname");
x.value=x.value.toUpperCase();
}
function sayHello()
{
alert("Hello Folks");
}
function displayDate()
{
document.getElementById("demo").innerHTML=Date();
}
function mykr()
{
var x=document.getElementById("fname1");
x.value=x.value.toUpperCase();
}
function loadImage()
{
alert("Image is loaded");
}
</script>
</head>
<body>
<b><p>Event:onchange</p></b>
Enter your name:<input type="text" id="fname"onchange="myFunction()">
<br><br><br>
Enter your name:<input type="text" id="fname1" onkeyup="mykr()">
<b><p>Event:onclick</p></b>
<input type="button"onClick="sayHello()"value="sayHello"/>
<br><br><br>
<b><p>Event.Actingonclick</p></b>
<p id="demo">This is a paragraph.</p>
<button type="button" onclick="displayDate()">Display Date</button>
<br><br><br>
<h1 onmouseover="style.color='red'" onmouseout="style.color='black'">Mouse over this
text</h1>
<img src="Koala.jpg" onload="loadImage()" width="100" height="132">
</body>
</html>

Output:
REMOVE THE ITEMS FROM THE DROP DOWNLIST
<html>
<head>
<script>
function removecolor()
{
var x=document.getElementById("colorselect");
x.remove(x.selectedIndex);
}
</script>
</head>
<body>
<meta charset=utf-8/>
<title>Remove iems from a dropdown list</title>
<form>
<select id="colorselect">
<option>Red</option>
<option>Purple</option>
<option>Green</option>
<option>Brown</option>
<option>Blue</option>
<option>Yellow</option>
<option>Black</option>
</select>
<input type="button" onclick="removecolor()" value="Select and Remove">
</form>
</body>
</html>
Output:
EMAIL VALIDATION
program7.html
<html>
<head>
<title>JavaScript form validation - checking email</title>
</head>
<body onload='document.form1.text1.focus()'>
<h2>Input an email and Submit</h2>
<form name="form1" action="#">
<input type='text' name='text1'/>
&nbsp;
<input type="submit" name="submit" value="Submit"
onclick="ValidateEmail(document.form1.text1)"/>
&nbsp;
</form>
<script src="program7a.jsp"></script>
</body>
</html

program7a.html
function ValidateEmail(inputText)
{
var mailformat = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;
if(inputText.value.match(mailformat))
{
document.form1.text1.focus();
return true;
}
else
{
alert("You have entered an invalid email address!");
document.form1.text1.focus();
return false;
}
}

Output:
DISPLAY THE RANDOM IMAGE
<html>
<head>
<script language="javascript">
ImageSwitch=new Array();
ImageSwitch[0]='Desert.jpg';
ImageSwitch[1]='Hydrangeas.jpg';
ImageSwitch[2]='Penguins.jpg'
ImageSwitch[3]='Tulips.jpg';
function SwapImage()
{
document.getElementById("img").setAttribute("src",ImageSwitch[Math.round(Math.random
()*3)]);
}
</script>
</head>
<body>
<img src="Desert.jpg" width="300" height="300" id="img" alt="Some Image">
<input type="button" value="click" onclick="SwapImage()">
</body>
</html>
Output:
DISPLAY THE FIRST NAME & LASTNAME IN JSP

HTML Coding
<html>
<body>
<center>
<form action="program9a.jsp" method="get">
First Name:<input type="text" name="web"><br>
Last Name:<input type="text" name="design"><br>
<input type="submit" value="Submit">
</form>
</body>
</html>
JSP Coding
<% String fn;
String ln;
fn=request.getParameter("web");
ln=request.getParameter("design");
out.println("First Name"+fn+"<br>");
out.println("Last Name"+ln+"<br>");
%>
Output:
PRIME NUMBER

HTML Coding
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=UTF-8">
<title>JSP Page</title>
</head>
<body>
<br>
<br>
<center>
<form action="program10a.jsp">
<h1>Enter the Number:<input type="text" name="n">
<br><br>
<input type="submit" value="Submit"></h1>
</form>
</center>
</body>
</html>

JSP Coding
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=UTF-8">
<title>
JSP Page</title>
</head>
<body>
<center><h1>The required result is::</h1>
<h2>
<%
int n,i,flag=0;
String ns=request.getParameter("n");
n=Integer.parseInt(ns);
if(n>1)
{
for(i=2;i<=2;i++)
{
if(n%i==0)
{
flag=1;
break;
}
}
}
if(flag==0)
{
out.println("<pre>");
out.println(n+"is a prime number");
out.println("<pre>");
}
else
{
out.println("<pre>");
out.println(n+"is not a prime number");
out.println("<pre>");
}
%>
</h2>
</center>
</body>
</html>
Output:
FORWARD THE FILE

HTML Coding
<html>
<body>
<form name="f1" action="program11a.jsp"><br>
Username::<input type="text" name="t1"><br>
Password::<input type="password" name="p1"><br>
<input type="submit" value="Click"><br>
</form>
</body>
</html>

JSP Coding 1
<html>
<body>
<% String n,p;
n=request.getParameter("t1");
p=request.getParameter("p1");
if((n.equals("bsc"))&(p.equals("csc")))
{
%>
<jsp:forward page="program11b.jsp"/>
<%}
else
{
%>
<%@include file="program11.html"%>
<%}
%>
</body>
</html>
JSP Coding 2
<html>
<body>
<h1>Forward Login Successfully</h1>
<p>
Welcome
<% out.println(request.getParameter("t1"));%>
</p>
</body>
</html>

Output:

Forward Login Successfully

Welcome bsc
WORKING WITH PAGE AND FORMS

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class _Default : System.Web.UI.Page


{
protected void Page_Load(object sender, EventArgs e)
{

}
protected void Button1_Click(object sender, EventArgs e)
{
string user, pwd;
user = "computer";
pwd = "csc";
if (user == TextBox1.Text && pwd == TextBox2.Text)
{
Response.Write("Welcome to ASP.Net");
}
else
{
Response.Write("Invalid ID and Password");
}
}
}
Output:
STUDENT DETAILS
XML Coding:
<?xml version="1.0" encoding="utf-8" ?>
<studentdetails>
<student>
<name>Gowtham</name>
<id>28</id>
<age>20</age>
</student>
<student>
<name>Sakthi</name>
<id>29</id>
<age>19</age>
</student>
<student>
<name>Saravana</name>
<id>31</id>
<age>21</age>
</student>
<student>
<name>Hari</name>
<id>32</id>
<age>20</age>
</student>
</studentdetails>

ASP.Net Button Coding:


using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{

}
protected void Button1_Click(object sender, EventArgs e)
{
DataSet ds = new DataSet();
ds.ReadXml(Server.MapPath("~/XMLFile.xml"));
GridView1.DataSource = ds.Tables[0];
GridView1.DataBind();
}
}

Output:
VALIDATION

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class _Default : System.Web.UI.Page


{
protected void Page_Load(object sender, EventArgs e)
{

}
protected void Button1_Click(object sender, EventArgs e)
{
Response.Write("Your Application was successfully completed");
}
}
Coding:
VEHICLE DETAILS- TREE VIEW
XML Coding:
<?xml version="1.0" encoding="utf-8" ?>
<vechicledetails>
<vechicle>
<name>Yamaha</name>
<manufactureyear>2018</manufactureyear>
<milage>60</milage>
<speed>80km/min</speed>
<price>90000</price>
<discount>22%</discount>
</vechicle>
<vechicle>
<name>Royal Enfield</name>
<manufactureyear>2017</manufactureyear>
<milage>70</milage>
<speed>130km/min</speed>
<price>175000</price>
<discount>12%</discount>
</vechicle>
</vechicledetails>

ASP.Net Button Coding:


using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Xml;
using System.IO;

public partial class _Default : System.Web.UI.Page


{
protected void Page_Load(object sender, EventArgs e)
{
XmlDocument xmldoc = new XmlDataDocument();
XmlNode xmlnode;
FileStream fs = new FileStream(@"C:\Users\STUDENT\Documents\Visual Studio
2010\WebSites\WebSite37\XMLFile.xml", FileMode.Open, FileAccess.Read);
xmldoc.Load(fs);
xmlnode = xmldoc.ChildNodes[1];
TreeView1.Nodes.Clear();
TreeView1.Nodes.Add(new TreeNode(xmldoc.DocumentElement.Name));
TreeNode tnode;
tnode = TreeView1.Nodes[0];
Addnode(xmlnode, tnode);
}
private void Addnode(XmlNode inxmlnode, TreeNode intreenode)
{
XmlNode xNode;
TreeNode tnode;
XmlNodeList nodelist;
int i = 0;
if (inxmlnode.HasChildNodes)
{
nodelist = inxmlnode.ChildNodes;
for (i = 0; i <= nodelist.Count - 1; i++)
{
xNode = inxmlnode.ChildNodes[i];
intreenode.ChildNodes.Add(new TreeNode(xNode.Name));
tnode = intreenode.ChildNodes[i];
Addnode(xNode, tnode);
}
}
else
{
intreenode.Text = inxmlnode.InnerText.ToString();
}

}
}

Output:
INSERT A STUDENT INFORMATION IN A DATABASE

using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data;
using System.Data.OleDb;
public partial class _Default : System.Web.UI.Page
{
OleDbConnection con;
OleDbCommand cmd;
protected void Page_Load(object sender, EventArgs e)
{
con = new OleDbConnection(@"Provider=Microsoft.ACE.OLEDB.12.0;Data
Source=C:\Users\STUDENT\Desktop\Javascript\student.accdb");
}
protected void BindUserDetails()
{
DataSet ds=new DataSet();
string strquery="SELECT * FROM table1";
using(con= new OleDbConnection(@"Provider=Microsoft.ACE.OLEDB.12.0;Data
Source=C:\Users\STUDENT\Desktop\Javascript\student.accdb"))
{
using(cmd=new OleDbCommand(strquery,con))
{
OleDbDataAdapter Da=new OleDbDataAdapter(cmd);
Da.Fill(ds);
}
}
GridView1.DataSource=ds;
GridView1.DataBind();
}
protected void Button1_Click(object sender, EventArgs e)
{
using(con= new OleDbConnection(@"Provider=Microsoft.ACE.OLEDB.12.0;Data
Source=C:\Users\STUDENT\Desktop\Javascript\student.accdb"))
{
cmd=new OleDbCommand();
con.Open();
cmd.CommandText="insert into
table1(Sname,Scourse,Sage)values('"+TextBox1.Text+"','"+TextBox2.Text+"','"+TextBox3.
Text+"')";
cmd.Connection=con;
cmd.ExecuteNonQuery();
con.Close();
TextBox1.Text="";
TextBox2.Text="";
TextBox3.Text="";
}
BindUserDetails();
}
}
Output:
WEBSITE FOR A DEPARTMENT
title.html
<hmtl>
<body bgcolor="lightgreen">
<center>
<h1>P.K.N Arts & Science College</h1>
<h2>Department of Computer Science</h2>
</center>
</body>
</html>
main.html
<html>
<frameset rows="20%,80%">
<frame src="title.html" name="a">
<frameset cols="40%,60%">
<frame src="functions.html" name="b">
<frame src="coll.html" name="c">
</frameset></frameset>
</html>
functions.html
<html>
<body bgcolor="skyblue"><br><center><b>Functions of our Department</b></center>
<br><br><a href="meet.html" target=c>Department Meet</a><br><br>
<a href="add.html" target=c>Additional courses</a>
</body>
</html>
meet.html
<html>
<body bgcolor="teal">
<p>Our Department practices department meet in inter and intra college courses.<br><br>
The following programs and competitions are conducted:<br><br><br>
<b>On Stage Competitions:</b><br>
Paper Presentations<br>Stress Interview<br>Dance<br>Quiz<br>
Software Marketing<br><br><br>
<b>OFF Stage Competitions:</b><br>
Web Designing<br>Debugging<br>Pencil Drawing<br>
</body>
</html>
add.html
<html>
<body bgcolor="yellow">
<br><br><b>Additional Courses:</b><br><br>
DTP<br><br><br>
HTML<br><br><br>
Web Designing Languages<br><br><br>
DCA</body>
</html>

Output:

You might also like