Week-9 Web Technologies Date:04-03-2014
advertisement
1
Week-1
Web Technologies
Date: 19-12-2013
Design the static web pages for online book store website.
1) HOME PAGE must contain 3 frames.
Top Frame: logo n collge name and links to home, login, registration and cart page.
Left Frame: Four links of navigation to display respective catalogues.
Right Frame: the pages to links in left frame must be loaded here. Initially it should contain description page.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
body,td,th {
color: #F00;
font-size: 24px;
}
body {
background-color: #000;
}
.text {
color: #FF80FF;
}
.text {
color: #F00;
}
.text {
font-family: Palatino Linotype, Book Antiqua, Palatino, serif;
}
.text {
font-family: Comic Sans MS, cursive;}
</style></head>
<body>
<table width="732" >
<tr>
<td width="045"><imgsrc="logo.jpg" alt="logo" /></td>
<td colspan="4"><div align="center" class="text"><strong><em>VIDYA VIKAS INSTITUTE OF
TECHOLOGY</em></strong></div></td></tr>
<tr>
<td><a href="home.html" target="right">HOME</a></td>
<td width="136"><div align="center"><a href="login.html" target="right">LOGIN</a></div></td>
<td width="168"><div align="center"><a href="reg.html" target="right">REGISTRATION</a></div></td>
<td width="049"><div align="center"><a href="cse.html" target="right">CATALOGUE</a></div></td>
<td width="170"><div align="center"><a href="cart.html" target="right">CART</a></div></td>
</tr>
</table>
</body>
</html>
VidyaVikas Institute of Technology
2
Week-1
Web Technologies
OUTPUT:
VidyaVikas Institute of Technology
Date: 19-12-2013
3
Week-1
Web Technologies
Date: 19-02-2014
2.LOGIN PAGE:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Login</title>
<style type="text/css">
body {
background-color: #000300;
}
body,td,th {
color: #FFF;
}
</style>
<body>
<form action="#" method="post" name="form1">
<table>
<tr>
<td>LOGIN:</td>
<td><input type="text" name="text1" value="" /></td>
</tr>
<tr>
<td>PASSWORD:</td>
<td><input type="password" name="pass" value="" /></td>
</tr>
<tr>
<td><div align="center">
<input type="submit" name="button" id="button" value="Submit" />
</div></td>
<td>
<input type="Reset" name="button2" id="button2" value="Reset" /></td>
</tr>
</table>
</form></body></html>
VidyaVikas Institute of Technology
4
Week-1
Web Technologies
Date: 19-02-2014
OUTPUT:
3) CATOLOGUE PAGE:
It should contain the details as follows:
1. Snap shot of cover page
2. Author Name
3.Publisher
4.Price
5. Add to cart button
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>catalogue</title>
</head>
<body>
<table width="998" height="1565" border="1" cellpadding="4" cellspacing="4">
<tr>
<td width="418"><imgsrc="XMLBIBLE.jpg" alt="xml" width="420" height="288" /></td>
<td><p>Book:xml Bible</p>
<p>Author:Winston</p>
<p>Publication:Wiely</p></td>
<td>$63</td>
<td width="171"><object classid="clsid:D27CDB6E-AE6D-04cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" width="035"
height="33">
VidyaVikas Institute of Technology
5
Week-1
Web Technologies
Date: 19-02-2014
<param name="movie" value="button6.swf" />
<param name="quality" value="high" />
<embed src="button6.swf" quality="high"
pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash"
type="application/x-shockwave-flash" width="035" height="33" ></embed>
</object></td>
</tr>
<tr>
<td><imgsrc="HTML IN 24.jpg" width="428" height="303" alt="ai" /></td>
<td><p>Book:AI</p>
<p>Author:S.Russel</p>
<p>Publication:Princeton</p>
<p>hall</p></td>
<td>$63</td>
<td><object classid="clsid:D27CDB6E-AE6D-04cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" width="035"
height="33">
<param name="movie" value="button7.swf" />
<param name="quality" value="high" />
<embed src="button7.swf" quality="high"
pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash"
type="application/x-shockwave-flash" width="035" height="33" ></embed>
</object></td>
</tr>
<tr>
<td height="312"><imgsrc="JAVA2.jpeg" width="416" height="247" alt="j2" /></td>
<td><p>Book:JAVA2</p>
<p>Author:S.Watson</p>
<p>Publication:BPB</p>
<p>Publications</p></td>
<td>$35.5</td>
<td><object classid="clsid:D27CDB6E-AE6D-04cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" width="035"
height="33">
<param name="movie" value="button8.swf" />
<param name="quality" value="high" />
<embed src="button8.swf" quality="high"
pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash"
type="application/x-shockwave-flash" width="035" height="33" ></embed>
</object></td>
</tr>
<tr>
<td height="398"><imgsrc="AI.jpg" width="434" height="261" alt="html" /></td>
<td><p>Book:HTML in 24 Hours</p>
<p>Author:Sam Peter</p>
<p>Publication:Sam</p>
<p>Publications</p>
<p></p></td>
<td>$50</td>
VidyaVikas Institute of Technology
6
Week-1
Web Technologies
Date: 19-12-2013
<td><object classid="clsid:D27CDB6E-AE6D-04cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" width="035"
height="33">
<param name="movie" value="button9.swf" />
<param name="quality" value="high" />
<embed src="button9.swf" quality="high"
pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash"
type="application/x-shockwave-flash" width="035" height="33" ></embed>
</object></td>
</tr>
</table>
<div align="center"></div>
</body>
</html>
OUTPUT:
VidyaVikas Institute of Technology
7
Week-2
Web Technologies
Date: 26-12-2013
4) CART PAGE:
The cart page contains the details about the books which are added to cart.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
body {
background-color: #8003FF;
}
body,td,th {
color: #FF0;
}
</style>
</head>
<body>
<table width="460" align="center">
<tr><th width="137" scope="col"><h3>Book name</h3></th>
<th width="04" scope="col"><h3>Price</h3></th>
<th width="04" scope="col"><h3>Quantity</h3></th>
<th width="144" scope="col"><h3>Amount</h3></th></tr>
<tr><td height="43"><div align="center">Java 2</div></td>
<td><div align="center">$35.5</div></td>
<td><div align="center">2</div></td>
<td><div align="center">$70.5</div></td>
</tr>
<tr>
<td height="74"><div align="center">Xml bible</div></td>
<td>$40.5</td>
<td><div align="center">1</div></td>
<td><div align="center">$40.5</div></td></tr>
<tr><td height="87" colspan="3"><div align="right"><h4>Total amount -</h4></div></td><td><div
align="center">$130.5</div></td></tr>
</table></body></html>
VidyaVikas Institute of Technology
8
Week-2
Web Technologies
OUTPUT:
VidyaVikas Institute of Technology
Date: 26-02-2014
9
Week-2
Web Technologies
Date: 26-12-2013
5) REGISTRATION PAGE:
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Registration</title>
<style type="text/css">
body {
background-color: #34E0DC;
}
body,td,th {
color: #FF0003;
}
</style>
</head>
<body>
<form action="#" method="get" name="form1" >
<table width="388" align="center">
<tr>
<td width="68"><font size="4">Name:</font></td>
<td width="304"><label for="textfield"></label>
<input type="text" name="name" id="textfield" /></td>
</tr>
<tr>
<td><font size="4">Password:</font></td>
<td><label for="textfield2"></label>
<input type="password" name="pwd" id="textfield2" /></td>
</tr>
<tr>
<td><font size="4">E-mail ID:</font></td>
<td><label for="textfield3"></label>
<input type="text" name="email" id="textfield3" /></td>
</tr>
<tr>
<td><font size="4">Phone Number:</font></td>
<td><label for="textfield4"></label>
<input type="text" name="phno" id="textfield4" /></td>
</tr>
<tr>
<td><font size="4">Gender:</font></td>
<td><input type="radio" name="Gender" id="radio" value="Gender" />
<label for="radio">Male
<input type="radio" name="Gender" id="radio2" value="Gender" />
Female</label></td>
</tr>
<tr>
<td><font size="4">Date Of Bith:</font></td>
<td><label for="select"></label>
<select name="DD" id="select">
VidyaVikas Institute of Technology
10
Week-2
Web Technologies
<option selected="selected" value="date">DD</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="03">03</option>
<option value="04">04</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 name="MM">
<option selected="selected" value="MM">MM</option>
<option value="jan">jan</option>
<option value="feb">feb</option>
<option value="mar">mar</option>
<option value="apr">apr</option>
<option value="may">may</option>
<option value="jun">jun</option>
<option value="jul">jul</option>
<option value="aug">aug</option>
<option value="sep">sep</option>
<option value="oct">oct</option>
<option value="nov">nov</option>
<option value="dec">dec</option>
</select>
VidyaVikas Institute of Technology
Date:26-02-2014
11
Week-2
Web Technologies
Date:26-02-2014
<select name="YYYY" id="select3">
<option selected="selected" value="YYYY">YYYY</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="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="2002">2002</option>
<option value="2001">2001 </option>
<option value="2002">2002</option>
<option value="2014">2014</option>
</select></td>
</tr>
<tr>
<td><font size="4">Languages Known:</font></td>
<td><input type="checkbox" name="checkbox" id="checkbox" />
<label for="checkbox">English
<input type="checkbox" name="checkbox2" id="checkbox2" />
Telugu
<input type="checkbox" name="checkbox3" id="checkbox3" />
Hindi
VidyaVikas Institute of Technology
12
Week-2
Web Technologies
Date:26-12-2013
<input type="checkbox" name="checkbox4" id="checkbox4" />
Tamil</label></td>
</tr>
<tr>
<td><font size="4">Address:</font></td>
<td><label for="textarea"></label>
<textarea name="textarea" id="textarea" cols="45" rows="5"></textarea></td>
</tr>
<tr><td width="68"><div align="center"><input type="submit"
value="submit"></div></td><td><input type="reset" value="reset"></td></tr>
</table>
</form></body></html>
OUTPUT:
VidyaVikas Institute of Technology
13
Week-3
Web Technologies
Date:02-01-2014
Write a java script to validate the following fields of the above registration page.
1. Name (Name should contain alphabets and the length should not be less than 6 characters).
2. Password(Password length should not be less than 6 characters).
3. E-mail id (should not containany invalid and must follow the standard pattern name@domain.com).
4. Phone number(phone number should contain 03 digits only).
<html>
<head>
<script type="text/javascript">
function validate(Form)
{
if((Form.name.value=="")&&(Form.name.value.length<6))
{
alert("please fill up the information and should have minimum of 6 characters");
Form.name.focus();
return false;
}
varname_re=new RegExp("Form.name.value");
if(Form.name.value.match(name_re))
{
alert("valid name");
return false;
}
if((Form.pwd.value=="")&&(Form.pwd.value.length<6))
{
alert("This field should not be left empty and should have minimum of 6 characters");
Form.pwd.focus();
return false;
}
var re = /^[A-Za-z]\w{6,}[A-Za-z]$/;
if(!re.test(Form.pwd.value))
{
alert("invalid password");
return false;
}
if(Form.email.value.length==0)
{
alert("Please enter a valid user name");
Form.email.focus();
return false;
}
var re=/^\w+([-.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;
if(!re.test(Form.email.value))
{
alert("Invalid username");
return false;
}
if(Form.phno.value=="")
{
alert("please enter phone number");
VidyaVikas Institute of Technology
14
Week-3
Web Technologies
Date:02-01-2014
Form.phno.focus();
return false;
}
var re=/^\d\d\d\d\d\d\d\d\d\d/;
if(!re.test(Form.phno.value))
{
alert("please enter a valid phone number");
return false;
}
alert("true");
}
</script>
</head>
<body>
<form action="#" method="post" name="form1" onSubmit="validate(this)">
<table width="388" align="center">
<tr>
<td width="68"><font size="4">Name:</font></td>
<td width="304"><label for="textfield"></label>
<input type="text" name="name" id="textfield" /></td>
</tr>
<tr>
<td><font size="4">Password:</font></td>
<td><label for="textfield2"></label>
<input type="password" name="pwd" id="textfield2" /></td>
</tr>
<tr>
<td><font size="4">E-mail ID:</font></td>
<td><label for="textfield3"></label>
<input type="text" name="email" id="textfield3" /></td>
</tr>
<tr>
<td><font size="4">Phone Number:</font></td>
<td><label for="textfield4"></label>
<input type="text" name="phno" id="textfield4" /></td>
</tr>
<tr><td><input type="submit" value="submit"></td>
</tr>
</table>
</body>
</html>
VidyaVikas Institute of Technology
15
Week-3
Web Technologies
OUTPUT:
VidyaVikas Institute of Technology
Date:02-01-2014
16
Week-4
Web Technologies
Date: 02-01-2014
Design a web page using CSS (Cascading Style Sheets) which includes the following:
1) Use different font, styles:In the style definition you define how each selector should work (font, color etc.).Then,
in the body of your pages, you refer to these selectors to activate the styles.
/* CSS Document */
p
{
background-color:#FF6CFF;
font:"Monotype Corsiva";
color:#0000FF;
}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>stylesheet</title>
<link rel="stylesheet" href="pstyles.css" type="text/css"/>
<style>
<!-h1,h2
{
border:double;
border-color:#FF0000;
color:#000000;
text-decoration:underline;
cursor:crosshair;
}-->
</style>
</head>
<body>
<p>This is an embedded style sheet</p>
<h1>Developed by cse</h1>
<h2>Students</h2>
</body>
</html>
VidyaVikas Institute of Technology
17
Week-4
Web Technologies
Date: 02-01-2014
Output:
2)Set
a
background
image
for
both
the
page
and
single
elements
on
the
page.
/* CSS Document */
body
{
background-image:url(../../5183.jpg);}
p
{
background-image:url(../../5217.jpg);
color:#FFF;
text-decoration:underline;
}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<link rel="stylesheet" href="bpstyles.css" type="text/css"/>
</head>
<body>
<p>This is a Style sheet<br />
A style is simply a set of formatting instructions that can be applied to a piece of text.<br />
There are three mechanisms by which we can apply styles to our HTML.</p>
</body>
</html>
VidyaVikas Institute of Technology
18
Week-4
Web Technologies
OUTPUT:
VidyaVikas Institute of Technology
Date:02-01-2014
19
Week-4
Web Technologies
Date:02-01-2014
3) Control the repetition of the image with the background-repeat property.
As background-repeat: repeat
Tiles the image until the entire page is filled, just like an ordinary background image in plain HTML.
/* CSS Document */
body
{
background-image:url(5631.jpg);
background-repeat:repeat;
}
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Repeat</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" href="bstyles.css" type="text/css"/>
<style type="text/css">
<!-.style1 {
font-family: "Copperplate Gothic Bold";
font-size: 36px;
}
body,td,th {
color: #FF0000;
}-->
</style>
</head>
<body>
<div align="center" class="style1">India is a Diversified Country</div>
</body>
</html>
VidyaVikas Institute of Technology
20
Week-4
Web Technologies
OUTPUT
VidyaVikas Institute of Technology
Date:02-01-2014
21
Week-4
Web Technologies
Date:16-01-2014
4) Define styles for links as
A:link
A:visited
A:active
A:hover
/* CSS Document */
A:link
{
text-decoration:none;
}
A:visited
{
Background-color:cyan;
text-decoration:line-through;
}
A:active
{
text-decoration:line-through;
font-family:"Monotype Corsiva";
font-stretch:ultra-condensed;
font-style:italic;
}
A:hover
{
font-size:18px;
color:#00FF40;
text-decoration:underline;
}
p
{
color:#8000FF;
text-align:center;
}
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" href="astyle.css" type="text/css"/>
<title>CSS</title>
<style type="text/css">
<!-.style1 {
font-family: "Monotype Corsiva";
font-weight: bold;
font-style: italic;
font-size: 18px;
}
-->
</style>
</head>
22
Week-4
Web Technologies
<body>
<p class="style1">This is a link </p>
<p><a href="5631.jpg">Nature</a></p>
</body>
</html>
OUTPUT:
VidyaVikas Institute of Technology
Date:16-01-2014
23
Week-4
Web Technologies
Date:16-01-2014
5) Work with layers:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Layers</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
<div style="z-index:1;position:absolute;top:75px;left:35px;height:200px;width:200px"><img src="6505.jpeg"
width="030" height="030"></div>
<div style="z-index:2;position:absolute;top:74px;left:154px;height:200px;width:200px"><img src="5487.jpg"
width="030" height="030"></div>
<div style="z-index:3;position:absolute;top:192px;left:36px;height:200px;width:200px"><img src="6201.jpg"
width="030" height="030"></div>
<div style="z-index:4;position:absolute;top:192px;left:154px;height:200px;width:200px"><img src="5631.jpg"
width="030" height="030"></div>
<div style="z-index:5;position:absolute;top:135px;left:91px;height:200px;width:200px"><img src="6892wide.jpg"
width="030" height="030"></div>
</body>
</html>
VidyaVikas Institute of Technology
24
Week-4
Web Technologies
OUTPUT
VidyaVikas Institute of Technology
Date:16-01-2014
25
Week-4
Web Technologies
Date: 16-01-2014
6) Add a customized cursor:
Selector{cursor:value}
<html>
<head>
<title>customized cursor</title>
<style type="text/css">
.dlink{cursor:default}
.clink{cursor:crosshair}
.hlink{cursor:help}
.mlink{cursor:move}
.clink{cursor:click}
.slink{cursor:scroll}
.wlink{cursor:wait}
.nlink{cursor:n-resize}
.elink{cursor:e-resize}
.plink{cursor:progress}
</style>
</head>
<body>
<p>&nbsp;</p>
<p align="center">&nbsp;</p>
<p><b><a href="a.html" class="dlink">default cursor</a>
<br/>
<a href="b.html" class="clink">crosshair cursor</a>
<br/>
<a href="c.html" class="hlink">help cursor</a>
<br/>
<a href="d.html" class="mlink">move cursor</a>
<br/>
<a href="e.html" class="clink">click cursor</a>
<br/>
<a href="f.html" class="slink">scroll cursor</a>
<br/>
<a href="g.html" class="wlink">wait cursor</a>
<br/>
<a href="h.html" class="nlink">n-resize cursor</a>
<br/>
<a href="i.html" class="elink">e-resize cursor</a>
<br/>
<a href="j.html" class="plink">progress cursor</a>
<br/>
</b></p>
</body>
</html>
VidyaVikas Institute of Technology
26
Week-4
Web Technologies
OUTPUT:
VidyaVikas Institute of Technology
Date: 16-01-2014
27
Week-5Web Technologies
Date: 23-01-2014
Write an XML file which will display the Book information which includes the following:
1) Title of the book
2) Author Name
3) ISBN number
4) Publisher name
5) Edition
6) Price
Write a Document Type Definition (DTD) to validate the above XML file.
Display the XML file as follows.
The contents should be displayed in a table. The header of the table should be in color GREY. And the Author names
column should be displayed in one color and should be capitalized and in bold. Use your own colors for remaining
columns.
Use XML schemas XSL and CSS for the above purpose.
Book.dtd
<!ELEMENT book-info (books+)>
<!ELEMENT books (Title-of –the-book+,Author-name+,ISBN-number+,Publication+, Edition+,Price+)>
<!ELEMENT Title-of-the-book (#PCDATA)>
<!ELEMENT Author-name (#PCDATA)>
<!ELEMENT ISBN-number (#PCDATA)>
<!ELEMENT Publications (#PCDATA)>
<!ELEMENT Edition (#PCDATA)>
<!ELEMENT Price (#PCDATA)>.
Book.xsl
<?xml version="1.0"?>
<xsl:stylesheet
version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
xmlns="http://www.w3.org/TR/REC-html40">
<xsl:template match="/">
<HTML>
<BODY>
<H1>Book Information</H1>
<TABLE border="1">
<TR><TH style="color:gray">Title-of-the-book</TH><TH style="color:gray">Author-name</TH><TH
style="color:gray">ISBN-number</TH><TH style="color:gray">Publications</TH><TH
style="color:grey">Edition</TH><TH style="color:grey" >Price</TH></TR>
<TR><TH style="color:gray">Title-of-the-book</TH><TH style="color:gray">Author-name</TH><TH
style="color:gray">ISBN-number</TH><TH style="color:gray">Publications</TH><TH
style="color:grey">Edition</TH><TH style="color:grey" >Price</TH></TR>
<xsl:for-each select="book-info/books">
<TR ><TD bgcolor="cyan" style="color:red" ><xsl:value-of select="Title-of-the-book"/></TD><TD bgcolor="pink"
style="color:green;text-transform:capitalize;font-styl2:bold"><xsl:value-of select="Author-name"/></TD>
<TD bgcolor="white" style="color:blue"><xsl:value-of select="ISBN-number" /></TD><TD bgcolor="purple"
style="color:yellow"><xsl:value-of select="Publications" /></TD>
VidyaVikas Institute of Technology
28
Week-5
Web Technologies
Date: 23-01-2014
<TD bgcolor="black" style="color:white"><xsl:value-of select="Edition"/></TD><TD bgcolor="white"
style="color:black"><xsl:value-of select="Price"/></TD></TR></xsl:foreach></TABLE></BODY></HTML></xsl:template>
</xsl:stylesheet>
Book.xml
<?xml version="1.0"?>
<?xml-stylesheet type="text/xsl" href="D:\web pages\week 5\books.xsl"?>
<!DOCTYPE book-info SYSTEM "D:\web pages\week 5\books.dtd">
<book-info>
<books>
<Title-of-the-book>Html in 24 hrs</Title-of-the-book>
<Author-name>Sam peter</Author-name>
<ISBN-number>81-265-0146-4</ISBN-number>
<Publications>Sam</Publications>
<Edition>2nd</Edition>
<Price>$40</Price>
</books>
<books>
<Title-of-the-book>Circuit Design</Title-of-the-book>
<Author-name>Wilson</Author-name>
<ISBN-number>81-7722-151-5</ISBN-number>
<Publications>Nownos</Publications>
<Edition>3rd</Edition>
<Price>$63</Price>
</books><books>
<Title-of-the-book>Electrical engineering</Title-of-the-book>
<Author-name>Darren Ashby</Author-name>
<ISBN-number>81-265-0188-x</ISBN-number>
<Publications>Nownos</Publications>
<Edition>2nd</Edition>
<Price>$35.5</Price></books>
<books>
<Title-of-the-book>A civil Action</Title-of-the-book>
<Author-name>Jonathan Harr</Author-name>
<ISBN-number>81-7722-023-x</ISBN-number>
<Publications>Pine Dealer</Publications>
<Edition>1st</Edition>
<Price>$50</Price>
</books>
</book-info>
VidyaVikas Institute of Technology
29
Week-5
Web Technologies
OUTPUT
VidyaVikas Institute of Technology
Date:23-01-2014
30
Week-5
Web Technologies
Book.css
book-info
{
display:block;
}
book
{
display:block;
font-size:14pt;
}
Title-of-the-book
{ display:block;
font-family:times new roman;
color:"green";
font-weight:bold;
font-size:25pt;
}
Author-name
{ display:block;
font-family:coppergatholic bold;
color:magenta;
font-size:20pt;
}
Publications,ISBN-number
{ display:block;
font-family:Monotypeorsiva;
color:pink;
font-size:15pt;
margin-left:03pt;
}
Edition,Price
{ display:block;
font-family:arial;
color:orange;
font-size:03pt;
margin-left:20pt;
}
VidyaVikas Institute of Technology
Date:23-01-2014
31
Week-5
Web Technologies
Date:23-01-2014
Book.xsd
<?xml version="1.0"?>
<xsd:schemaxmlns:xsd="http://www.w3.org/2001/XMLSchema"
targetNamespace="http://your_namespace"
xmlns="http://your_namespace">
<xsd:element name="book-info">
<xsd:complexType>
<xsd:sequence>
<xsd:element name="books" minoccurs="1" maxoccurs="4">
<xsd:complexType>
<xsd:sequence>
<xsd:element name="Title-of-the-book" xsd:type="xsd:string"/><xsd:element name="Author-name"
xsd:type="xsd:string"/>
<xsd:element name="ISBN-number" xsd:type="xsd:decimal"/><xsd:element name="Publications" xsd:type="xsd:string"/>
<xsd:element name="Edition" xsd:type="xsd:decimal"/><xsd:element name="Price"
xsd:type="xsd:decimal"/></xsd:sequence></xsd:complexType></xsd:element></xsd:sequence></xsd:complexType></xsd
:element>
</xsd:schema>
BookInfo.xml
<?xml version="1.0"?>
<?xml-stylesheet type="text/css" href="book.css"?>
<book-info xmlns="http://your_namespace"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://your_namespace
D:\divya\books.xsd">
<books>
<Title-of-the-book>Html in 24 hrs</Title-of-the-book>
<Author-name>Sam peter</Author-name>
<ISBN-number>81-265-0146-4</ISBN-number>
<Publications>Sam</Publications>
<Edition>2nd</Edition>
<Price>$40</Price>
</books>
<books>
<Title-of-the-book>Circuit Design</Title-of-the-book>
<Author-name>Wilson</Author-name>
<ISBN-number>81-7722-151-5</ISBN-number>
<Publications>Nownos</Publications>
<Edition>3rd</Edition>
<Price>$63</Price>
</books>
<books>
<Title-of-the-book>Electrical engineering</Title-of-the-book>
<Author-name>Darren Ashby</Author-name>
VidyaVikas Institute of Technology
32
Week-5
Web Technologies
<ISBN-number>81-265-0188-x</ISBN-number>
<Publications>Nownos</Publications>
<Edition>2nd</Edition>
<Price>$35.5</Price></books>
<books>
<Title-of-the-book>A civil Action</Title-of-the-book>
<Author-name>Jonathan Harr</Author-name>
<ISBN-number>81-7722-023-x</ISBN-number>
<Publications>Pine Dealer</Publications>
<Edition>1st</Edition>
<Price>$50</Price>
</books>
</book-info>
VidyaVikas Institute of Technology
Date:23-01-2014
33
Week-5
Web Technologies
OUTPUT
VidyaVikas Institute of Technology
Date:23-01-2014
34
Week-6
Web Technologies
Date:30-01-2014
Create a simple visual bean with a area filled with a color.
The shape of the area depends on the property shape. If it is set to true then the shape of the area is Rectangle and it is
Circle, if it is false.
The color of the area should be changed dynamically for every mouse click. The color should also be changed if we change
the color in the “property window “.
packagemypack;
importjava.awt.*;
importjava.awt.event.*;
importjava.io.serializable;
public class Colors extends Canvas implements Serializable
{
transient private Color color;
publicboolean rectangular;
public Colors()
{
addMouseListener(new MouseAdapter()
{
public void mousePressed(MouseEvent me)
{
change();
}
});
rectangular=true;
setSize(300,300);
change();
}
publicbooleangetRectangular()
{
return rectangular;
}
public void setRectangular(boolean flag)
{
this.rectangular=flag;
repaint();
}
public void change()
{
color=randomColor();
repaint();
}
private Color randomColor()
{
int r=(int)(255*Math.random());
int g=(int)(255*Math.random());
int b=(int)(255*Math.random());
return new Color(r,g,b);
}
VidyaVikas Institute of Technology
35
Week-6
Web Technologies
public void paint(Graphics g)
{
g.setColor(color);
if(rectangular)
{
g.fillRect(0,0,300,300);
}
else
{
g.fillOval(0,0,300,300);
}
}
}
VidyaVikas Institute of Technology
Date:30-01-2014
36
Week-6
Web Technologies
OUTPUT
VidyaVikas Institute of Technology
Date:30-01-2014
37
Week-7
Web Technologies
Date:13-02-2014
1. Installation of tomcat web server and apache server
VidyaVikas Institute of Technology
38
Week-7
Web Technologies
VidyaVikas Institute of Technology
Date:13-02-2014
39
Week-7
Web Technologies
VidyaVikas Institute of Technology
Date:13-02-2014
40
Week-7
Web Technologies
VidyaVikas Institute of Technology
Date:13-02-2014
41
Week-7
Web Technologies
VidyaVikas Institute of Technology
Date:13-02-2014
42
Week-7
Web Technologies
Date:13-02-2014
2) Access the above developed static web pages for books web site, using these
servers by putting the web pages developed in week-1 and week-2 in the document
root.
Directory structure
VidyaVikas Institute of Technology
43
Week-8
Web Technologies
Date:20-02-2014
Assume four users user1,user2,user3 and user4 having the passwords pwd1,pwd2,pwd3 and pwd4 respectively. Write a
servelet for doing the following.
1.
Create a Cookie and add these four user id’s and passwords to this Cookie.
2. Read the user id and passwords entered in the Login form (week1) and authenticate with the values (user id and
passwords ) available in the cookies.
If he is a valid user(i.e., user-name and password match) you should welcome him by name(user-name) else you should
display “ You are not an authenticated user “.
LOGIN.HTM:
<html>
<head>
<title>login</title>
</head>
<body>
<center>
<form name="b" action="http://localhost:4040/cse/Authenticate">
<table>
<tr>
<td>name:<td><input type="text" name="uname"></td>
</tr>
<tr>
<td>password:<td><input type="password" name="upass"</td>
</tr>
<tr>
<td colspan="2" align="right"><input type="submit" value="submit">
</table>
</form>
</body>
</html>
ERROR.HTM:
<html>
<head>
</head>
<body>
<center>
user name or the password you entered are wrong please try again!
<form name="b" action="http://localhost:4040/cse/Authenticate">
<table>
<tr>
<td>name:<td><input type="text" name="uname"></td>
</tr>
<tr>
<td>password:<td><input type="password" name="upass"></td>
</tr>
<tr>
<td colspan="2" align="right"><input type="submit" value="submit">
</table>
</form>
</body></html>
VidyaVikas Institute of Technology
44
Week-8
Web Technologies
Date: 20-02-2014
USERNAMES.HTMl:
<html>
<head>
<title>
enter users name and passwords
</title>
</head>
<body>
<form name="a" method="get" action="http://localhost:4040/cse/Mycookie">
<table>
<tr>
<td>Name:</td><td><input type="text" name="uname1"></td>
<td>Password:</td><td><input type="password" name="pass1"></td>
</tr>
<tr>
<td>Name:</td><td><input type="text" name="uname2"></td>
<td>Password:</td><td><input type="password" name="pass2"></td>
</tr>
<tr>
<td>Name:</td><td><input type="text" name="uname3"></td>
<td>Password:</td><td><input type="password" name="pass3"></td>
</tr>
<tr>
<td>Name:</td><td><input type="text" name="uname4"></td>
<td>Password:</td><td><input type="password" name="pass4"></td>
</tr>
<tr>
<td colspan="4" align="right"><input type="submit" value="submit">
</table>
</form>
</body>
</html>
WELCOME.HTMl:
<html>
<body>
<h2>
Welcome to our website
</h2>
</body>
</html>
VidyaVikas Institute of Technology
45
Week-8
Web Technologies
Date:20-02-2014
ATHENTICATEUSER.JAVA:
importjavax.servlet.*;
importjavax.servlet.http.*;
import java.io.*;
public class AuthenticateUser extends HttpServlet
{
public void doGet(HttpServletRequestreq,HttpServletResponse res)throws ServletException,IOException
{
int i=0;
int k=0;
String name=req.getParameter("uname");
String pass=req.getParameter("upass");
Cookie a[]=req.getCookies();
PrintWriter out=res.getWriter();
boolean flag=false;
for(i=0;i<a.length;)
{
if(name.equals(a[i].getValue()))
{
k=i+1;
if(pass.equals(a[k].getValue()))
{
flag=true;
break;
}
}
i=i+2;
}
if(flag)
{
res.sendRedirect("http://localhost:4040/cse/welcome.htm");
}
else
{
res.sendRedirect("http://localhost:4040/cse/error.htm");
}}}
}
VidyaVikas Institute of Technology
46
Week-8
Web Technologies
Date:20-02-2014
Cookie.java:
importjavax.servlet.*;
importjavax.servlet.http.*;
import java.io.*;
public class CookieProgram extends HttpServlet
{
public void doGet(HttpServletRequestreq,HttpServletResponse res)throws ServletException,IOException
{
String name1=req.getParameter("uname1");
String pass1=req.getParameter("pass1");
Cookie a=new Cookie("u1",name1);
Cookie b=new Cookie("p1",pass1);
res.addCookie(a);
res.addCookie(b);
System.out.println("Cookie is added");
String name2=req.getParameter("uname2");
String pass2=req.getParameter("pass2");
Cookie c=new Cookie("u2",name2);
Cookie d=new Cookie("p2",pass2);
res.addCookie(c);
res.addCookie(d);
System.out.println("cookie is added");
String name3=req.getParameter("uname3");
String pass3=req.getParameter("pass3");
Cookie e=new Cookie("u3",name3);
Cookie f=new Cookie("p3",pass3);
res.addCookie(e);
res.addCookie(f);
System.out.println("cookie is added");
String name4=req.getParameter("uname4");
String pass4=req.getParameter("pass4");
Cookie g=new Cookie("u4",name4);
Cookie h=new Cookie("p4",pass4);
res.addCookie(g);
res.addCookie(h);
System.out.println("cookie is added");
res.sendRedirect("http://localhost:4040/cse/login.htm");}}
}
VidyaVikas Institute of Technology
47
Week-8
Web Technologies
OUTPUT
VidyaVikas Institute of Technology
Date:20-02-2014
48
Week-8
Web Technologies
VidyaVikas Institute of Technology
Date:20-02-2014
49
Week-8
Web Technologies
VidyaVikas Institute of Technology
Date:20-02-2014
50
Week-8
Web Technologies
Date: 27-02-2014
Use init-parameters to do this. Store the user-names and passwords in the webinf.xml and access them in the servlet by
using the getInitParameters() method.
LOGIN.HTML:
<html>
<head>
<title>login</title>
</head>
<body>
<center>
<form name="b" action="http://localhost:9020/init/InitParameters">
<table>
<tr>
<td>name:<td><input type="text" name="uname"></td>
</tr>
<tr>
<td>password:<td><input type="password" name="upass"></td>
</tr>
<tr>
<td colspan="2" align="right"><input type="submit" value="submit">
</table>
</form>
</body>
</html>
ERROR.HTML:
<html>
<head>
<title>login</title>
</head>
<body>
<center>
user name or the password you entered are wrong please try again
<form name="b" action="http://localhost:9020/init/InitParameters">
<table>
<tr>
<td>name:<td><input type="text" name="uname"></td>
</tr>
<tr>
<td>password:<td><input type="password" name="upass"></td>
</tr>
<tr>
<td colspan="2" align="right"><input type="submit" value="submit">
</table>
</form>
</body></html>
VidyaVikas Institute of Technology
51
Week-8
Web Technologies
Date:27-02-2014
<tr>
<td>password:<td><input type="password" name="upass"></td>
</tr>
<tr>
<td colspan="2" align="right"><input type="submit" value="submit">
</table>
</form>
</body>
</html>
WELCOME.HTM:
<html>
<body>
<h2>
Welcome to our website
</h2>
</html>
INITPARA.JAVA
importjavax.servlet.*;
importjavax.servlet.http.*;
import java.io.*;
importjava.util.*;
public class InitPara extends HttpServlet
{
public void doGet(HttpServletRequestreq,HttpServletResponse res)throws ServletException,IOException
{
String name=req.getParameter("uname");
String pass=req.getParameter("upass");
Enumeration e=getInitParameterNames();
boolean flag=false;
while(e.hasMoreElements())
{
String iname=(String)e.nextElement();
if(name.equals(iname))
{
if(pass.equals(getInitParameter(iname)))
{
flag=true;
break;
}
}
}
if(flag)
{
res.sendRedirect("http://localhost:9020/init/welcome.htm");
}
else
{
res.sendRedirect("http://localhost:9020/init/error.htm");
}
}}}
VidyaVikas Institute of Technology
52
Week-8
Web Technologies
Date:27-02-2014
WEB.XML:
<web-app>
<servlet>
<servlet-name>InitParameters</servlet-name>
<servlet-class>InitPara</servlet-class>
<init-param>
<param-name>user1</param-name>
<param-value>pass1</param-value>
</init-param>
<init-param>
<param-name>user2</param-name>
<param-value>pass2</param-value>
</init-param>
<init-param>
<param-name>user3</param-name>
<param-value>pass3</param-value>
</init-param>
<init-param>
<param-name>user4</param-name>
<param-value>pass4</param-value>
</init-param>
</servlet>
<servlet-mapping>
<servlet-name>InitParameters</servlet-name>
<url-pattern>/InitParameters</url-pattern>
</servlet-mapping>
</web-app>
</init-param>
</servlet>
<servlet-mapping>
<servlet-name>InitParameters</servlet-name>
<url-pattern>/InitParameters</url-pattern>
</servlet-mapping>
</web-app>
VidyaVikas Institute of Technology
53
Week-8
Web Technologies
OUTPUT:
VidyaVikas Institute of Technology
Date:27-02-2014
54
Week-8
Web Technologies
VidyaVikas Institute of Technology
Date:27-02-2014
55
Week-8
Web Technologies
VidyaVikas Institute of Technology
Date:27-02-2014
56
Week-9
Web Technologies
Date: 04-03-2014
Create a table which should contain at least the following fields: name, password, email-id, phone number(these should
hold the data from the registration form).
Write a java program/servlet/JSP to connect to that database and extract data from the tables and display them. Experiment
with various SQL queries.
Insert the details of the users who register with the web site, whenever a new user clicks the submit button in the
registration page .
1.DATA BASE CONNECTIVITY BY USING STANDALONES
EX.JAVA:
importjava.sql.*;
public class Ex
{
public static void main (String s[])throws Exception
{
DriverManager.registerDriver(new sun.jdbc.odbc.JdbcOdbcDriver());
Connection con=DriverManager.getConnection("jdbc:odbc:dsn","scott","tiger");
Statement st=con.createStatement();
int i=st.executeUpdate("create table register(name varchar2(7),password varchar2(7),email varchar2(6),phone
varchar(4))");
System.out.println("table was created");
st.close();
con.close();
}
}
PREPAREDSTATEMENTTYPE.JAVA
importjava.sql.*;
public class PreparedStatementType
{
public static void main(String s[])throws Exception
{
Class.forName("oracle.jdbc.driver.OracleDriver");
Connectioncon=DriverManager.getConnection("jdbc:oracle:thin:@localhost:1521:db","scott","tiger”);
PreparedStatementps=con.prepareStatement("insert into register values(?,?,?,?)");
ps.setString(1,"abc");
ps.setString(2,"abc");
ps.setString(3,"def");
int Count=ps.executeUpdate();
System.out.println("034 record has been inserted and count is:"+Count);
ps.setString(1,"habeeb");
ps.setString(2,"devi");
ps.setString(3,"jkl");
ps.setString(4,"mno");
Count=ps.executeUpdate();
System.out.println("035 record has been inserted and count is:"+Count);
ps.close();
con.close();
}}
}
VidyaVikas Institute of Technology
57
Week-9
Web Technologies
Date: 04-03-2014
STATEMENTEX.JAVA
importjava.sql.*;
public class StatementEx
{
public static void main(String s[])throws Exception
{
DriverManager.registerDriver(new sun.jdbc.odbc.JdbcOdbcDriver());
Connection con=DriverManager.getConnection("jdbc:odbc:dsn","scott","tiger");
Statement st=con.createStatement();
int i=st.executeUpdate("update register set NAME="klm" where EMAIL="def"");
System.out.println("table was created");
st.close();
con.close();
}
}
RESULTSETEX.JAVA:
importjava.sql.*;
public class ResultSetEx
{
public static void main(String s[])throws Exception
{
DriverManager.registerDriver(new sun.jdbc.odbc.JdbcOdbcDriver());
Connection con=DriverManager.getConnection("jdbc:odbc:dsn","scott","tiger");}
PreparedStatementps=con.prepareStatement("select * from register where NAME="abc"");
ps.setString(1,"abc");
ps.setString(2,"abc");
ps.setString(3,"def");
ps.setString(4,"ghi");
ResultSetrs=ps.executeQuery();
while(rs.next())
{
System.out.println(rs.getString(1)+""+rs.getString(2)+""+rs.getString(3)+""+rs.getString(4));
}
rs.close();
ps.close();
con.close();
}
}
VidyaVikas Institute of Technology
58
Week-9
Web Technologies
OUTPUT
VidyaVikas Institute of Technology
Date: 04-03-2014
59
Week-9
Web Technologies
Date:04-03-2014
2.Using servlets create table,update table ,select table .
CREATEPRGSER
importjava.sql.*;
importjavax.servlet.*;
importjavax.servlet.http.*;
import java.io.*;
public class CreatePrgSer extends GenericServlet
{
Connection con;
public void init(ServletConfigsc)
{
try
{
DriverManager.registerDriver(new oracle.jdbc.driver.OracleDriver());
con=DriverManager.getConnection("jdbc:oracle:thin:@personal-7948a2:1521:oracle9","scott","tiger");
System.out.println(con);
}
catch(Exception e)
{
System.out.println("error "+e.getMessage());
}
}
public void service(ServletRequestreq,ServletResponse res)throws IOException,ServletException
{
try
{
ResultSetrs;
Statement st;
st=con.createStatement();
rs=st.executeQuery(“create table student1(name varchar2(20),ambition varchar2(20)
native_ofvarchar2(20)”);
PrintWriter out=res.getWriter();
out.println("Table was created");
}
catch(Exception e)
{
System.out.println("ERROR "+e.getMessage());
}
}
public void destroy()
{
rs.close();
st.close();
con.close();
}
VidyaVikas Institute of Technology
60
Week-9
Web Technologies
Date:04-03-2014
INSERTPRGSER.JAVA
importjava.sql.*;
importjavax.servlet.*;
importjavax.servlet.http.*;
import java.io.*;
public class InsertPrgSer extends GenericServlet
{
Connection con;
public void init(ServletConfigsc)
{
try
{
DriverManager.registerDriver(new oracle.jdbc.driver.OracleDriver());
con=DriverManager.getConnection("jdbc:oracle:thin:@personal-7948a2:1521:oracle9","scott","tiger");
System.out.println(con);
}
catch(Exception e)
{
System.out.println("error "+e.getMessage());
}
}
public void service(ServletRequestreq,ServletResponse res)throws IOException,ServletException
try
{
ResultSetrs;
PreparedStatementpst;
pst=con.prepareStatement("insert into student1 values(?,?,?)");
pst.setString(1,"a");
pst.setString(2,"b");
pst.setString(3,"c");
int c=pst.executeUpdate();
pst.setString(1,"d");
pst.setString(2,"e");
pst.setString(3,"f");
pst.executeUpdate();
c++;
pst.executeUpdate();
c++;
pst.setString(1,"g");
pst.setString(2,"h");
pst.setString(3,"i");
pst.executeUpdate();
c++;
pst.setString(1,"j");
pst.setString(2,"k");
pst.setString(3,"l");
VidyaVikas Institute of Technology
61
Week-9
Web Technologies
Date:04-03-2014
pst.executeUpdate();
c++;
pst.setString(1,"m");
pst.setString(2,"n");
pst.setString(3,"o”);
pst.executeUpdate();
c++;
pst.setString(1,"p");
pst.setString(2,"q");
pst.setString(3,"r");
pst.executeUpdate();
c++;
PrintWriter out=res.getWriter();
out.println(c+" rows are inserted”);
}
catch(Exception e)
{
System.out.println("ERROR "+e.getMessage());
}
}
public void destroy()
{
rs.close();
pst.close();
con.close();
}
}
UpdatePrgSer.java:
importjava.sql.*;
importjavax.servlet.*;
importjavax.servlet.http.*;
import java.io.*;
public class UpdatePrgSer extends GenericServlet
{
Connection con;
public void init(ServletConfigsc)
{
try
{
DriverManager.registerDriver(new oracle.jdbc.driver.OracleDriver());
con=DriverManager.getConnection("jdbc:oracle:thin:@personal-7948a2:1521:oracle9","scott","tiger");
System.out.println(con);
}
catch(Exception e)
{
System.out.println("error "+e.getMessage());
}
}
VidyaVikas Institute of Technology
62
Week-9
Web Technologies
Date:04-03-2014
public void service(ServletRequestreq,ServletResponse res)throws IOException,ServletException
{
try
{
ResultSetrs;
PreparedStatementpst;
pst=con.prepareStatement("update student1 set name=? where ambition=?");
pst.setString(1,"a");
pst.setString(2,"b");
int c=pst.executeUpdate();
pst.setString(1,"c");
pst.setString(2,"d”);
pst.executeUpdate();
c++;
pst.setString(1,"e");
pst.setString(2,"f");
pst.executeUpdate();
c++;
pst.setString(1,"g");
pst.setString(2,"h");
pst.executeUpdate();
c++;
pst.setString(1,"i");
pst.setString(2,"j");
pst.executeUpdate();
c++;
pst.setString(1,"k");
pst.setString(2,"l");
pst.executeUpdate();
c++;
PrintWriter out=res.getWriter();
out.println(c+" rows are updated");
}
catch(Exception e)
{
System.out.println("ERROR "+e.getMessage());}}
public void destroy()
{
rs.close();
st.close();
con.close();
}
}
VidyaVikas Institute of Technology
63
Week-9
Web Technologies
Date:04-03-2014
Web.xml:
<web-app>
<servlet>
<servlet-name>CreatePrgSer</servlet-name>
<servlet-class>CreatePrgSer</servlet-class>
</servlet>
<servlet>
<servlet-name>InsertPrgSer</servlet-name>
<servlet-class>InsertPrgSer</servlet-class>
</servlet>
<servlet>
<servlet-name>UpdatePrgSer</servlet-name>
<servlet-class>UpdatePrgSer</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>CreatePrgSer</servlet-name>
<url-pattern>/cps</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>InsertPrgSer</servlet-name>
<url-pattern>/ips</url-pattern>
</servlet-mapping>
<servlet-mapping>
<servlet-name>UpdatePrgSer</servlet-name>
<url-pattern>/ups</url-pattern>
</servlet-mapping>
</web-app>
OUTPUT:
For CreatePrgSer.java:
VidyaVikas Institute of Technology
64
Week-9
Web Technologies
Date:04-03-2014
OUTPUTS:
For InsertPrgSer.java
For UpdatePrgSer.java
VidyaVikas Institute of Technology
65
Week-03
Web Technologies
Date:04-03-2014
Write a JSP which does the following job:
Insert the details of the 3 or 4 users who register with the web site (week9) by using
registration form. Authenticate the user when he submits the login form using the user
name and password from the database ( similar to week8 instead of cookies).
CREATING TABLE : register
QUERY: create table register(name varchar2(20),password varchar2(20));
:insert into register values(‘user’,’pass1’);
: insert into register values(‘user2’,’pass2’);
: select * from register;
VidyaVikas Institute of Technology
66
Week-03
Web Technologies
Date:04-03-2014
VAL.HTM:
<html>
<head>
<title>Login</title>
</head>
<body>
<form name="a" action="http://localhost:9020/week03/val.jsp">
<table>
<tr>
<td>UserName:</td><td><input type="text" name="uname"/></td></tr><tr>
<td>Password:</td><td><input type="password" name="pass"/></td></tr><tr>
<td><input type="submit" value="Login"></td>
</tr>
<table>
</center>
</form>
</body>
</html>
ERROR.HTM:
<html>
<head><title>Login</title></head>
<body><form name="a" action="http://localhost:9020/week03/val.jsp">
<center><p style="color:red">Enter password or username are incorrect</p>
<table>
<tr>
<td>UserName:</td><td><input type="text" name="uname"/></td></tr><tr>
<td>Password:</td><td><input type="password" name="pass"/></td></tr><tr>
<td><input type="submit" value="Login"></td></tr>
<table>
</center>
</form>
</body>
</html>
VidyaVikas Institute of Technology
67
Week-03
Web Technologies
Date:04-03-2014
VAL.JSP:
<%@page import="java.sql.*,java.io.*"%>
<%!
Connection con;
Statement st;
ResultSetrs;
boolean flag=false;
%>
<%
DriverManager.registerDriver(new oracle.jdbc.driver.OracleDriver());
try
{
con=DriverManager.getConnection("jdbc:oracle:thin:@localhost:1521:db","scott","tiger”);
System.out.println(con);
st=con.createStatement();
rs=st.executeQuery("select * from register");
String name=request.getParameter("uname");
String pass=request.getParameter("pass");
System.out.println("outside");
while(rs.next())
{
System.out.println(1);
if(name.equals(rs.getString(1)))
{
if(pass.equals(rs.getString(2)))
{
flag=true;
break;
}
}
}
if(flag)
{%>
<%=name+"welcome to our VidyaVikas institute of technology"%>
<%
flag=false;
}
else
{%>
<%="Enter Username or password are invalid please try again"%>
<%
response.sendRedirect("error.html");
}
}
catch(Exception e)
{
}
%>
VidyaVikas Institute of Technology
68
Week-03
Web Technologies
Directory structure:
VidyaVikas Institute of Technology
Date:04-03-2014
69
Week-03
Web Technologies
OUTPUT:
VidyaVikas Institute of Technology
Date:04-03-2014
70
Week-03
Web Technologies
VidyaVikas Institute of Technology
Date:04-03-2014
71
Week-04
Web Technologies
Date:18-03-2014
Create tables in the database which contain the details of items (books in our case like Book name , Price, Quantity,
Amount )) of each category. Modify your catalogue page (week 2)in such a way that you should connect to the database
and extract data from the tables and display them in the catalogue page using JDBC.
TYPE.java
importjava.sql.*;
importjava.lang.*;
public class Type
{
public static void main(String s[])throws Exception
{
DriverManager.registerDriver(new sun.jdbc.odbc.JdbcOdbcDriver());
Connection con=DriverManager.getConnection("jdbc:odbc:mdsn","scott","tiger");
Statement st=con.createStatement();
int i=st.executeUpdate("create table book2(BookName char(8),Price number(03),Quantity number(03),Amount
number(03))");
st.executeUpdate("insert into book2 values('JAVA' ,250,2,500 )");
st.executeUpdate("insert into book2 values('DBMS' ,350,3,0350 )");
st.executeUpdate("insert into book2 values('WT' ,030,3,300 )");
ResultSetrs=st.executeQuery("select * from book2");
System.out.println("table was created");
while(rs.next())
{
System.out.println(rs.getString(1)+"\t"+rs.getInt(2)+"\t"+rs.getInt(3)+"\t"+rs.getInt(4));
}
}
}
DISPLAY.JSP
<%@page import="java.sql.*,java.io.*"%>
<%!
Connection con;
Statement st;
ResultSetrs;
%>
<%
DriverManager.registerDriver(new oracle.jdbc.driver.OracleDriver());
try
{
con=DriverManager.getConnection("jdbc:oracle:thin:@localhost:1521:db","scott","tiger");
st=con.createStatement();
rs=st.executeQuery("select * from book2");
%>
VidyaVikas Institute of Technology
72
Week-04
Web Technologies
Date:18-03-2014
<body bgcolor=”cyan”>
<center>
<table border=1>
<tr><th>TITLE</th><th>PRICE</th><th>QUANTITY</th><th>AMOUNT</th></tr>
<tr>
<%
while(rs.next())
{%>
<td><%=rs.getString(1)%></td>
<td><%=rs.getInt(2)%></td>
<td><%=rs.getInt(3)%></td>
<td><%=rs.getInt(4)%></td>
</tr>
<%
}
%></table></center></body><%}
catch(Exception e){}
%>
VidyaVikas Institute of Technology
73
Week-04
Web Technologies
OUTPUT:
VidyaVikas Institute of Technology
Date:18-03-2014
74
Week-12
Web Technologies
Date:25-03-2014
Write a Session program to display date and time
SESSION.JAVA
import java.io.*;
importjava.util.*;
importjavax.servlet.*;
importjavax.servlet.http.*;
public class DateServlet extends HttpServlet
{
public void doGet(HttpServletRequestrequest,HttpServletResponse response)throws ServletException,IOException
{
HttpSessionhs=request.getSession(true);
response.setContentType("text/html");
PrintWriter pw=response.getWriter();
pw.print("<B>");
Date date=(Date)hs.getAttribute("date");
if(date!=null)
{
pw.print("Last access:"+date+"<br>");
}
date=new Date();
hs.setAttribute("date",date);
pw.println("Current date:"+date);
}
}
Web.xml:
<web-app>
<servlet>
<servlet-name>fs</servlet-name>
<servlet-class>DateServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>fs</servlet-name>
<url-pattern>/KK</url-pattern>
</servlet-mapping>
</web-app>
VidyaVikas Institute of Technology
75
Week-12
Web Technologies
Date:25-03-2014
COMPILATION
VidyaVikas Institute of Technology
76
Week-12
Web Technologies
DIRECTORY STRUCTURE:
OUTPUT:
VidyaVikas Institute of Technology
Date:25-03-2014
