100% found this document useful (1 vote)
282 views

Wad Practical

The document contains code to create a webpage with two frames divided into equal rows and columns. The top frame is divided into two equal columns with a red background on the left and a blue background on the right. The bottom frame is also divided into two equal columns with a green background on the left and a yellow background on the right.

Uploaded by

Harsh Parikh
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
100% found this document useful (1 vote)
282 views

Wad Practical

The document contains code to create a webpage with two frames divided into equal rows and columns. The top frame is divided into two equal columns with a red background on the left and a blue background on the right. The bottom frame is also divided into two equal columns with a green background on the left and a yellow background on the right.

Uploaded by

Harsh Parikh
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 68

WAD

Practical-1: Create your resume using HTML tags also


experiment with colors, text, link, size and also other tags you
studied.
<html>
<head>
<title> Practical1 </title>
</head>
<body>

<h1 align="center"><u><b>RESUME</b></u></h1>

<h2><u><b><i>Personal Details:</i></b></u></h2>

<p><font size=4><b>NAME:</b>Javiya Axay R.</font></p>


<p><font size=4><b>AGE:</b> 19</font></p>
<p><font size=4><b>GENDER:</b> Male</font></p>
<p><font size=4><b>MOBILE:</b> 9974773054</font></p>
<p><font size=4><b>EMAIL ID:</b>[email protected]</font></p>
<p><font size=4><b>DATE
1995</font></p>

OF

BIRTH:</b>

<hr>
120130107005

Page 1

16<sup>th</sup>

August

WAD
<h2><u><b><i>Educational Details:</i></b></u></h2><br>

<table width="50%" height="25%" border="1" cellspacing="0" cellpadding="5">


<tr>
<th ><font size=4>YEAR</font></th>
<th ><font size=4>DEGREE</font></th>
<th > <font size=4>UNIVERSITY</font></th>
<th ><font size=4>MARKS OBTAINED</font></th>
</tr>
<tr>
<td ><p align="center"><font size=4>2012</font></p></td>
<td ><p align="center"><font size=4>B.E.(<b>Pursuing</b>)
Computer Engineering.</font></p></td>
<td ><p align="center"><font size=4>Gujarat Technological University
</font></p></td>
<td ><p align="center"><font size=4>7.70<br>(current CPI)
</font></p></td>
</tr>
<tr>
<td ><p align="center"><font size=4>2012</font></p></td>
<td ><p align="center"><font size=4>HSC</font></p></td>
<td ><p align="center"><font size=4>GSHEB</font></p></td>

120130107005

Page 2

WAD
<td ><p align="center"><font size=4>88%</font></p></td>
</tr>
<tr>
<td ><p align="center"><font size=4>2010</font></p></td>
<td ><p align="center"><font size=4>SSC</font></p></td>
<td ><p align="center"><font size=4>GSHEB</font></p></td>
<td ><p align="center"><font size=4>87%</font></p></td>
</tr>
</table>
<br>
<h2><u><b><i>Hobbies:</i></b></u></h2>

<ol type="1" start><font size=4>


<li>Music & Movies </li>
<li>Playing And Watching Cricket</li>
<li>Enjoying with Friends</li>
<li>Adventure & Tours </li>
</font></ol>

<h2><u><b><i>Technical Skills:</i></b></u></h2>

<ul><font size=4>
<li><b>Programming Languages:</b></li>
120130107005

Page 3

WAD
</font></ul>

<p><font size=4>
1. JAVA (Core and Advanced)<br>
2. HTML (basics.)<br>
3. php (basic level)
</font></p>

<h3><u><b><i>Other Technical Knowledge:</i></b></u></h3>

<p><font size=4>
- Computer Networks.<br>
- Data Structure &amp; Algorithm : Design and Analysis.<br>
- Design Patterns for software engineering and their implementation in
Java.<br>
</font></p>

<hr>
<h2><u><b><i>Expectation from the Job:</i></b></u></h2>

<p><ul><font size=4><b>
Presenting the CV for the purpose of part-time Job only.<br>
</b></font></ul></p>
120130107005

Page 4

WAD

<h2><u><b><i>Enclosures:</i></b></u></h2>

<ol type="1" start><font size=4>


<li>Xerox-Copy of BE Marksheet.</li>
<li>Xerox-Copy of HSC Marksheet.</li>
<li>Xerox-Copy of SSC Marksheet.</li>
<li>Xerox-copy of Achievements certificates.</li>
</font></ol>

<p><font size=4><b>I hereby declare that the above mentioned information is true
to the best of my knowledge.</b></font></p>
<h3>Yours Faithfully,</h3>Axay R Javiya
</body>
</html>

OUTPUT:
120130107005

Page 5

WAD

RESUME
Personal Details:
NAME:Javiya Axay R.
AGE: 19
GENDER: Male
MOBILE: 9974773054
EMAIL ID:[email protected]
DATE OF BIRTH: 16th August 1995

Educational Details:
UNIVER
SITY

MARKS
OBTAI
NED

B.E.
(Pursuing
Gujarat
201
)
Technolog
2
Computer
ical
Engineerin University
g.

7.70
(current
CPI)

YE
AR

201
2

DEGREE

HSC

120130107005

GSHEB

88%

Page 6

WAD
201
0

SSC

GSHEB

87%

Hobbies:
1. Music & Movies
2. Playing And Watching Cricket
3. Enjoying with Friends
4. Adventure & Tours

Technical Skills:
Programming Languages:
1. JAVA (Core and Advanced)
2. HTML (basics.)
3. php (basic level)
Other Technical Knowledge:
- Computer Networks.
- Data Structure & Algorithm : Design and Analysis.
- Design Patterns for software engineering and their implementation in Java.

Expectation from the Job:


Presenting the CV for the purpose of part-time Job only.

Enclosures:
1. Xerox-Copy of BE Marksheet.

120130107005

Page 7

WAD
2. Xerox-Copy of HSC Marksheet.
3. Xerox-Copy of SSC Marksheet.
4. Xerox-copy of Achievements certificates.
I hereby declare that the above mentioned information is true to the best of my
knowledge.
Yours Faithfully,
Axay R Javiya

Practical-2: Create your class timetable using table tag.

<html>
<head><title> Practical 2 </title></head>
<body>
<h2 align="center"><b><i><u> COMPUTER ENGINEERING DEPARTMENT
</u></i></b></h2>
<h3 align="center"><b>6<sup>th</sup>CE-A DIVISION</b></h3>
<table width="80%" height="60%" align="center" border="1" cellspacing="0"
cellpadding="0">
<tr>
<td colspan="7"><b><font size="4">CLASSROOM: 5001</b></font> </td>
</tr>
<tr>
<th><font size="4">Time</font></th>
<th><font size="4">Monday</font></th>

120130107005

Page 8

WAD
<th><font size="4">Tuesday</font></th>
<th><font size="4">Wednesday</font></th>
<th><font size="4">Thursday</font></th>
<th><font size="4">Friday</font></th>
</tr>
<tr>
<td><font size="4">9:30 - 10:30</font></td>
<td><font size="4">SE (M5)</font></td>
<td><font size="4">SP (M6)</font></td>
<td><font size="4">CG (VHB)</font></td>
<td><font size="4">TOC (NSS)</font></td>
<td><font size="4">WAD (NS)</font></td>
</tr>
<tr>
<td><font size="4">10:30 - 11:30</font></td>
<td><font size="4">SP (MBC)</font></td>
<td><font size="4">IS (NSS)</font></td>
<td><font size="4">WAD (NS)</font></td>
<td><font size="4">SE (M4)</font></td>
<td><font size="4">IS (NSS)</font></td>
</tr>
<tr>
<td><font size="4">11:30 - 12:00</font></td>
<th colspan="5" align="center"><font size="4">Recess</font></th>
</tr>
<tr height="80">
<td><font size="4">12:00 - 14:00</font></td>
<td><font size="4">SE LAB (UP)</font></td>
<td><font size="4">IS LAB (NSS)</font></td>
<td><font size="4">CG LAB (VHB)</font></td>
<td><font size="4">WAD LAB (NS)</font></td>
<td><font size="4">SP LAB (VF1)</font></td>
</tr>
<tr>

120130107005

Page 9

WAD
<td><font size="4">14:00 - 14:30</font></td>
<th colspan="5" align="center"><font size="4">Recess</font></th>
</tr>
<tr>
<td><font size="4">14:30 - 15:30</font></td>
<td><font size="4">IS (NSS)</font></td>
<td><font size="4">CG (VF1)</font></td>
<td><font size="4">SE (M4)</font></td>
<td><font size="4">IS (NSS)</font></td>
<td><font size="4">TOC (M8)</font></td>
</tr>
<tr>
<td><font size="4">15:30 - 16:30</font></td>
<td><font size="4">CG (VF1)</font></td>
<td><font size="4">SE (M5)</font></td>
<td><font size="4">TOC (M8)</font></td>
<td><font size="4">WAD (NS)</font></td>
<td><font size="4">CG (VF1)</font></td>
</tr>
</table>
</body>
</html>

120130107005

Page 10

WAD

OUTPUT:

120130107005

Page 11

WAD

Pratical-3: Create user Feedback Form.


<html>
<head><title> 3</title></head>
<body>
<form>
<h2 align="center"><u>STUDENT FEEDBACK FORM</u></h2>
<input type="text" name="name" size="50"><br>
<h3>Enrollment Number:<br></h3>
<input type="text" name="enrol" size="50"><br>
<h3>Gender:<br></h3>
<input type="radio" name="gender" value="male"><b>Male</b>
<input type="radio" name="gender" value="female"><b>Female</b>
<h3>Date Of Birth:<br></h3>
<input type="date" name="date" size="30"><br>
<h3>Branch:</h3><br>
120130107005

Page 12

WAD
<select>
<option>CE</option>
<option>IT</option>
<option>EC</option>
<option>IC</option>
<option>Metallurgy</option>
<option>Bio-Medical</option>
</select>
<h3>Email ID:</h3><br>
<input type="text" name="email" size="50"><br>
<h3>Address:</h3><br>
<textarea name="address" rows="3" cols="38"></textarea><br>
<h3>City:</h3><br>
<input type="text" name="city" size="30"><br>
<h3>State:</h3><br>
<input type="text" name="state" size="30"><br>
<h3>Pin Code:</h3><br>
<input type="text" name="pin" size="30"><br>
<h3>Comments:</h3><br>
<textarea name="comments" rows="5" cols="38"></textarea><br>
<input type="submit" value="Submit">
<input type="reset" value="Reset">
</form>
</body>
</html>

120130107005

Page 13

WAD

OUTPUT:

120130107005

Page 14

WAD

120130107005

Page 15

WAD

Pratical-4: Create a web page using frame. Divide the page into
two parts with Navigation links on left hand side of page
(width=20%) and content page on right hand side of page (width
= 80%). On clicking the navigation Links corresponding content
must be shown on the right hand side.
Frameset.html
<html>
<head><title>frameset</title></head>
<frameset cols="20%,80%">
<frame src="Red.html" name="red">
<frame src="Green.html" name="data">
<frame src="Dept.html" name="data">
</frameset>
</html>
Red.html
<html>
<head><title>frameset</title></head>
<body>
<a href="Dept.html" target=data>Dept</a>
<a href="Green.html" target=data>Green</a>
</body>
</html>
Dept.html
120130107005

Page 16

WAD
<html>
<head>
<title> Departments</title>
</head>
<body bgcolor="cyan">
<b><h1>WELCOME TO GEC, GANDHINAGAR</h1></b><br>
<u><h3>VISION:</h3></u><br>
<p>To be a premier engineering institution, imparting quality education for
innovative solutions relevant to society and environment.
</p><br>
<u><h3>MISSION:</h3></u><br>
<P>To develop human potential to its fullest extent so that intellectual and
innovative engineers can emerge in a wide range of professions.
To advance knowledge and educate students in engineering and other areas
of scholarship that will best serve the nation and the world in future.
To produce quality engineers, entrepreneurs and leaders to meet the present
and future needs of society as well as environment.</p>
</body>
</html>
Green.html
<html>
<head><title>frameset</title></head>
<body bgcolor="gray">
<center>
<h1>hello everyone</h1>
<h3>dont click it</h3>
<a href="https://www.google.co.in/"><h1>Google</h1></a>
</center>
</body>
</html>

120130107005

Page 17

WAD

OUTPUT:
Click on dept

Click on green

120130107005

Page 18

WAD

Pratical-5: Write html code to develop a webpage having two


frames that divide the webpage into two equal rows and then
divide the row into equal columns fill each frame with a
different background color.
Frameset.html
<html>
<head><title>frameset</title></head>
<frameset rows="50%,50%">
<frameset cols="50%,50%">
<frame src="Red.html" name="red">
<frame src="Green.html" name="green">
</frameset>
<frameset cols="50%,50%">
<frame src="Blue.html" name="blue">
<frame src="yellow.html" name="yellow">
</frameset>
</frameset>
</html>
Red.html
<html>
<head><title>frameset</title></head>
<body bgcolor="red">
120130107005

Page 19

WAD
</body>
</html>
Green.html
<html>
<head><title>frameset</title></head>
<body bgcolor="green">
</body>
</html>
Blue.html
<html>
<head><title> DEpartments</title></head>
<body bgcolor="blue">
</body>
</html>
Yellow.html
<html>
<head><title>frameset</title></head>
<body bgcolor="yellow">
</body>
</html>

OUTPUT:

120130107005

Page 20

WAD

Practical-6: Use Inline CSS to format your resume that you


created in practical no 01.
<html>
<head><title> Practical1 </title></head>
<body>

<h1
align="center"
style="font-family:jokerman;fontsize:50;color:black"><u><b>RESUME</b></u></h1>

<h2
style="font-family:arial;color:gray"><u><b><i>Personal
Details:</i></b></u></h2>

<p><font size=4><b>NAME:</b>Javiya Axay .</font></p>


<p><font size=4><b>AGE:</b> 19</font></p>
<p><font size=4><b>GENDER:</b> Male</font></p>
<p><font size=4><b>MOBILE:</b> 9974773054 </font></p>
<p><font size=4><b>EMAIL ID:</b>[email protected]</font></p>

120130107005

Page 21

WAD
<p><font size=4><b>DATE
1995</font></p>

OF

BIRTH:</b>

16<sup>th</sup>

August

<hr>
<h2
style="font-family:arial;color:gray"><u><b><i>Educational
Details:</i></b></u></h2><br>

<table width="50%" height="25%" border="1" cellspacing="0" cellpadding="5">


<tr style="font-family:Aharoni;font-size:20;background-color:gray">
<th >YEAR</th>
<th >DEGREE</th>
<th >UNIVERSITY</th>
<th >ARKS OBTAINED</th>
</tr>
<tr style="background-color:lightgray">
<td ><p align="center"><font size=4>2012</font></p></td>
<td ><p align="center"><font size=4>B.E.(<b>Pursuing</b>)
Computer Engineering.</font></p></td>
<td ><p align="center"><font size=4>Gujarat Technological University
</font></p></td>
<td ><p align="center"><font size=4>7.70<br>(current CPI)
</font></p></td>
</tr>

120130107005

Page 22

WAD
<tr style="background-color:lightgray">
<td ><p align="center"><font size=4>2012</font></p></td>
<td ><p align="center"><font size=4>HSC</font></p></td>
<td ><p align="center"><font size=4>GSHEB</font></p></td>
<td ><p align="center"><font size=4>88%</font></p></td>
</tr>
<tr style="background-color:lightgray">
<td ><p align="center"><font size=4>2010</font></p></td>
<td ><p align="center"><font size=4>SSC</font></p></td>
<td ><p align="center"><font size=4>GSHEB</font></p></td>
<td ><p align="center"><font size=4>87%</font></p></td>
</tr>
</table>
<br>
<h2 style="font-family:arial;color:gray"><u><b><i>Hobbies:</i></b></u></h2>

<ol type="1" start><font size=4>


<li>Music & Movies</li>
<li>Playing And Watching Cricket</li>
<li>Enjoy with Friends</li>
<li>Adventure & tours</li>
</font></ol>

120130107005

Page 23

WAD
<h
style="font-family:arial;color:gray"><u><b><i>Technical
Skills:</i></b></u></h2>

<ul><font size=4>
<li><b>Programming Languages:</b></li>
</font></ul>
<p><font size=4>
1. JAVA (Core and Advanced)<br>
2. HTML (basics.)<br>
3. Php(basic)
</font></p>

<p><font size=4>
- Computer Networks.<br>
- Data Structure &amp; Algorithm : Design and Analysis.<br>
- Design Patterns for software engineering and their implementation in
Java.<br>
</font></p>

<hr>
<h2 style="font-family:arial;color:gray"><u><b><I>Expectation
Job:</I></b></u></h2>

120130107005

Page 24

from

the

WAD
<p><ul><font size=4><b>
Presenting the CV for the purpose of part-time Job only.<br>
</b></font></ul></p>

<h2
family:arial;color:gray"><u><b><i>Enclosures:</i></b></u></h2>

style="font-

<ol type="1" start><font size=4>


<li>Xerox-Copy of BE Marksheet.</li>
<li>Xerox-Copy of HSC Marksheet.</li>
<li>Xerox-Copy of SSC Marksheet.</li>
<li>Xerox-copy of Extra Achievement certificates.</li>
</font></ol>
<p><font size=4><b>I hereby declare that the above mentioned information is true
to the best of my knowledge.</b></font></p>

<h3 style="font-family:arial;color:gray">Yours Faithfully,</h3>Axay R Javiya


</body>
</html>

120130107005

Page 25

WAD

OUTPUT:

RESUME
Personal Details:
NAME:Javiya Axay .
AGE: 19
GENDER: Male
MOBILE: 9974773054
EMAIL ID:[email protected]
DATE OF BIRTH: 16th August 1995

Educational Details:
ARKS
YE DEGRE UNIVER
OBTAI
AR
E
SITY
NED

120130107005

Page 26

WAD
B.E.
(Pursuin
Gujarat
201
g)
Technologi
2 Computer
cal
Engineeri University
ng.

7.70
(current
CPI)

201
2

HSC

GSHEB

88%

201
0

SSC

GSHEB

87%

Hobbies:
1. Music & Movies
2. Playing And Watching Cricket
3. Enjoy with Friends
4. Adventure & tours

Technical Skills:
Programming Languages:
1. JAVA (Core and Advanced)
2. HTML (basics.)
3. Php(basic)

120130107005

Page 27

WAD
- Computer Networks.
- Data Structure & Algorithm : Design and Analysis.
- Design Patterns for software engineering and their implementation in Java.

Expectation from the Job:


Presenting the CV for the purpose of part-time Job only.

Enclosures:
1. Xerox-Copy of BE Marksheet.
2. Xerox-Copy of HSC Marksheet.
3. Xerox-Copy of SSC Marksheet.
4. Xerox-copy of Extra Achievement certificates.
I hereby declare that the above mentioned information is true to the best of my
knowledge.
Yours Faithfully,
Axay R Javiya

Practical-7: Use External and internal CSS to format your class


timetable as you created in practical no 03.
<html>
<head>
<title> Practical 2 </title>
<style>
h2{font-family:jokerman;font-size:30;color:gray;text-align:center}

120130107005

Page 28

WAD
h3{font-family:aharoni;text-align:center}
th{font-family:arial;text-align:center;background-color:gray}
td{font-family:arial;text-align:center;background-color:lightgray}
</style>
</head>
<body>
<h2><b><I><u>
COMPUTER
</u></I></b></h2>

ENGINEERING

DEPARTMENT

<h3><b>6<sup>th</sup>CE-A DIVISION</b></h3>
<table width="80%" height="60%" align="center" border="1" cellspacing="0"
cellpadding="0">
<tr>
<td colspan="7"><b><font size="4">CLASSROOM: 5001</b></font> </td>
</tr>
<tr>
<th><font size="4">Time</font></th>
<th><font size="4">Monday</font></th>
<th><font size="4">Tuesday</font></th>
<th><font size="4">Wednesday</font></th>
<th><font size="4">Thursday</font></th>
<th><font size="4">Friday</font></th>
</tr>
<tr>
<td><font size="4">9:30 - 10:30</font></td>
<td><font size="4">SE (M5)</font></td>
<td><font size="4">SP (M6)</font></td>
<td><font size="4">CG (VHB)</font></td>
<td><font size="4">TOC (NSS)</font></td>
<td><font size="4">WAD (NS)</font></td>
</tr>

120130107005

Page 29

WAD
<tr>
<td><font size="4">10:30 - 11:30</font></td>
<td><font size="4">SP (MBC)</font></td>
<td><font size="4">IS (NSS)</font></td>
<td><font size="4">WAD (NS)</font></td>
<td><font size="4">SE (M4)</font></td>
<td><font size="4">IS (NSS)</font></td>
</tr>
<tr>
<th><font size="4">11:30 - 12:00</font></th>
<th colspan="5"><font size="4">Recess</font></th>
</tr>
<tr>
<td><font size="4">12:00 - 14:00</font></td>
<td><font size="4">SE LAB (UP)</font></td>
<td><font size="4">IS LAB (NSS)</font></td>
<td><font size="4">CG LAB (VHB)</font></td>
<td><font size="4">WAD LAB (NS)</font></td>
<td><font size="4">SP LAB (VF1)</font></td>
</tr>
<tr>
<th><font size="4">14:00 - 14:30</font></th>
<th colspan="5"><font size="4">Recess</font></th>
</tr>
<tr>
<td><font size="4">14:30 - 15:30</font></td>
<td><font size="4">IS (NSS)</font></td>
<td><font size="4">CG (VF1)</font></td>
<td><font size="4">SE (M4)</font></td>
<td><font size="4">IS (NSS)</font></td>
<td><font size="4">TOC (M8)</font></td>
</tr>
<tr>
<td><font size="4">15:30 - 16:30</font></td>

120130107005

Page 30

WAD
<td><font size="4">CG (VF1)</font></td>
<td><font size="4">SE (M5)</font></td>
<td><font size="4">TOC (M8)</font></td>
<td><font size="4">WAD (NS)</font></td>
<td><font size="4">CG (VF1)</font></td>
</tr>
</table>
</body>
</html>

OUTPUT:

Practical-8: Develop a JavaScript to display todays date.


<html>
<head>
<title> Welcome to Script </title>
</head>
<body>
<script type=text/javascript>
120130107005

Page 31

WAD
document.write("<br>Today is: "+new Date());
</script>
</body>
</html>

OUTPUT:

Practical-9: Develop simple calculator for addition, subtraction,


multiplication and division operation using JavaScript

<html>
<head>
<title> Calculator </title>
<script>

120130107005

Page 32

WAD
function add(n1,n2)
{
var no1=parseFloat(n1)
var no2=parseFloat(n2)
frm.total.value=no1+no2;
}
function sub(n1,n2)
{
var no1=parseFloat(n1)
var no2=parseFloat(n2)
frm.total.value=no1-no2;
}
function mul(n1,n2)
{
var no1=parseFloat(n1)
var no2=parseFloat(n2)
frm.total.value=no1*no2;
}
function div(n1,n2)
{
var no1=parseFloat(n1)
var no2=parseFloat(n2)
frm.total.value=no1/no2;
}
function clr()
{
frm.num1.value="0";
frm.num2.value="0";
frm.total.value="0";
}
</script>
</head>
<body bgcolor="lightgray">

120130107005

Page 33

WAD
<form name=frm>
<b>Number-1:
<input type=text name=num1><br>
<b>Number-2:
<input type=text name=num2><br>
<b>Result:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<input type=text name=total><br>
<input type=button value=Sum onClick="add(num1.value,num2.value)">
<input type=button value=Sub onClick="sub(num1.value,num2.value)">
<input type=button value=Mul onClick="mul(num1.value,num2.value)">
<input type=button value=Div onClick="div(num1.value,num2.value)">
<input type=button value=Clear onClick="clr()">
</form>
</body>

OUTPUT:

120130107005

Page 34

WAD

Practical-10: Create HTML Page with JavaScript which takes


Integer number as input and tells whether the number is ODD or
EVEN.
<html>
<head>
<title> Even Odd No </title>
120130107005

Page 35

WAD
</head>
<body bgcolor="green">
<script>
var no;
no=prompt("Enter any No.");
if(no%2==0)
alert("Number is Even");
else
alert("Number is Odd");
</script>
</body>

OUTPUT:

120130107005

Page 36

WAD

Practical-11: Create HTML Page that contains form with fields


Name, Email, Mobile No, Gender, Favorite Color and a button
now write a JavaScript code to combine and display the
information in textbox when the button is clicked.

120130107005

Page 37

WAD
<html>
<head>
<title>Practical 11</title>
<script type="text/javascript">
Function print()
{
var pra="";
for(var I=0;i<5;i++)
{
if(document.form[I].value)
{
pra=pra+" "+document.form[I].value;
}
}
document.form.answer.value=pra;
}
</script>
</head>
<body>
<form name="form">
<p><b><font size="4">Name:</font></b><input type="text" name="name"><br>
<p><b><font size="4">Email ID:</font></b><input type="text" name="email"
size="23"><br>
<p><b><font
size="4">Mobile
No:</font></b><input
type="text"
name="number"><br>
<p><b><font size="4">Gender:</font></b>
<select name="select">
<option>Male</option>
<option>Female</option>
</select>

120130107005

Page 38

WAD
<p><b><font size="4">Favorite Color:</font></b>
<select name="select">
<option>Black</option>
<option>White</option>
<option>Blue</option>
<option>Pink</option>
<option>Green</option>
<option>Yellow</option>
<option>Purple</option>
<option>Orange</option>
<option>Red</option>
</select><br>
<p><input type="button" name=button value="Print" onclick="print(this.form)">
<input type="reset" value="Reset"></p>
<p><textarea name="answer" rows="10" cols="50" value=""></textarea></p>
</form>
</body>
</html>

OUTPUT:

120130107005

Page 39

WAD

Practical-12: Implement Validation in above ( practical no.11).

PRAC.html
<html>
<head>
120130107005

Page 40

WAD
<title>Insert title here</title>
<script type="text/javascript" src="js/v.js"></script>
</head>
<body>
<form
action="usercontrol"
method="post"
onsubmit="return
name="form">
<table>
<tr>
<td>
<label>Fullname :</label>
</td>
<td>
<input type="text" name="fullname" id="fullname"/>
</td>
</tr>
<tr>
<td>
<label>Email Id :</label>
</td>
<td>
<input type="text" name="emailid" id="emailid"/>
</td>
</tr>
<tr>
<td>
<label>Mobile No. :</label>
</td>
<td>
<input type="text" name="mno" id="mno"/>
</td>
</tr>
<tr>
<td>
<label>Gender :</label>

120130107005

Page 41

valid()"

WAD
</td>
<td>
<input type="radio" name="gender" id="gender" value="male"/>Male
<input type="radio" name="gender" id="gender" value="female"/>Female
</td>
</tr>
<tr>
<td>
<label>Color :</label>
</td>
<td>
<select name="color">
<option value="RED">RED</option>
<option value="GREEN">GREEN</option>
<option value="YELLOW">YELLOW</option>
<option value="BLUE">BLUE</option>
<option value="WHITE">WHITE</option>
</select>
</td>
</tr>
<tr>
<td colspan="2">
<input type="submit" onclick="" name="add" value="Submit"/>
<input type="reset" name="reset" value="Clear"/>
</td>
</tr>
</table>
</form>
</body>
</html>

v.js
function valid()
120130107005

Page 42

WAD
{
var fname=document.getElementById("fullname");
if(fname.value == "")
{
alert("Please Enter a Fullname.");
fname.focus();
return false;
}
var email=document.getElementById("emailid");
var mailformat = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;
if(!email.value.match(mailformat))
{
alert("You have entered an invalid email address!");
email.value ="";
email.focus();
return false;
}
var mno = document.getElementById("mno");
var phoneno = /^\d{10}$/;
if(!mno.value.match(phoneno))
{
alert("You have entered an invalid Mobile NO!");
mno.value ="";
mno.focus();
return false;
}

if ( ( form.gender[0].checked == false ) && ( form.gender[1].checked == false ) )


{
alert ( "Please choose your Gender: Male or Female" );
return false;

120130107005

Page 43

WAD
}
return true;
}

OUTPUT:

Practical-13: Create XML file to store student information like


Enrollment Number, Name, Mobile Number, and Email Id.
<?xml version="1.0"?>
<!-- the document instance -->
<WAD-18>
<student>
120130107005

Page 44

WAD
<enrollment>120130107017</enrollment>
<name>ABC</name>
<contact>987654321</contact>
<email>[email protected]</email>
</student>
<student>
<enrollment>120130107100</enrollment>
<name>PQR</name>
<contact>7698543217</contact>
<email>[email protected]</email>
</student>
</WAD-18>

OUTPUT:

Practical-14: Create DTD for above ( Practical No. 13 ).

Student.xml
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE students SYSTEM "students.dtd">
<!-- the document instance -->
<students>
120130107005

Page 45

WAD
<student>
<enrollment>120130107017</enrollment>
<name>ABC</name>
<contact>987654321</contact>
<email>[email protected]</email>
</student>
<student>
<enrollment>120130107100</enrollment>
<name>PQR</name>
<contact>7698543217</contact>
<email>[email protected]</email>
</student>
</students>

Students.dtd
<?xml version="1.0" encoding="UTF-8"?>
<!ELEMENT students(student)*>
<!ELEMENT student(enrollment,name,mobile,email)>
<!ELEMENT enrollment(#PCDATA)>
<!ELEMENT name(#PCDATA)>
<!ELEMENT mobile(#PCDATA)>
<!ELEMENT email(#PCDATA)>

OUTPUT:

120130107005

Page 46

WAD

Practical-15: Create XML Schema for above ( Practical No.13)

Student.xml
<?xml version="1.0" encoding="UTF-8"?>
<students
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:noNamespaceSchemaLocation="students.xsd">
<!-- the document instance -->
<students>
120130107005

Page 47

WAD
<student>
<enrollment>120130107017</enrollment>
<name>ABC</name>
<contact>987654321</contact>
<email>[email protected]</email>
</student>
<student>
<enrollment>120130107100</enrollment>
<name>PQR</name>
<contact>7698543217</contact>
<email>[email protected]</email>
</student>
</students>

Students.xsd
<?xml version="1.0"?>
<xs:schema xmlns:xs="http://www.w3.org/2001/XMLSchema">
<xs:element name="students">
<xs:complexType>
<xs:sequence>
<xs:element name="enrollment" type="xs:string"/>
<xs:element name="name" type="xs:string"/>
<xs:element name="mobile" type="xs:string"/>
<xs:element name="email" type="xs:string"/>
</xs:sequence>
</xs:complexType>
</xs:element>
</xs:schema>

OUTPUT:

120130107005

Page 48

WAD

Practical-16: Create XSL file to convert above (refer Practical


No. 13) XML file into XHTML file.

Student_xml.xml
<?xml version="1.0"?>
<!--Link the XSL Style Sheet to the XML Document-->
<?xml-stylesheet type="text/xsl" href="student_xsl.xsl"?>
<!-- the document instance -->
<WAD-18>
120130107005

Page 49

WAD
<student>
<enrollment>120130107017</enrollment>
<name>ABC</name>
<contact>987654321</contact>
<email>[email protected]</email>
</student>
<student>
<enrollment>120130107100</enrollment>
<name>PQR</name>
<contact>7698543217</contact>
<email>[email protected]</email>
</student>
</WAD-18>

Student_xsl.xsl
<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet
version="1.0"
xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
<html>
<head>
<title>WAD Practical - 18</title>
<style type="text/css">
table tr{
font-family : Courier New; font-size : 1em;
}
h2{ text-align : center;}
</style>
</head>
<body>
<h2>WAD Practical - 18</h2>
<table border="1" align="center" cellspacing="2" cellpadding="2">
<tr bgcolor="#9acd32">

120130107005

Page 50

WAD
<th>Enrollment</th>
<th>Name</th>
<th>Contact</th>
<th>Email</th>
</tr>
<xsl:for-each select="WAD-18/student">
<tr>
<td><xsl:value-of select="enrollment"/></td>
<td><xsl:value-of select="name"/></td>
<td><xsl:value-of select="contact"/></td>
<td><xsl:value-of select="email"/></td>
</tr>
</xsl:for-each>
</table>
</body>
</html>
</xsl:template>
</xsl:stylesheet>

OUTPUT:

120130107005

Page 51

WAD

Practical-17: Write a php program to display todays date in ddmm-yyyy format.


120130107005

Page 52

WAD
<!DOCTYPE html>
<html>
<body>
<?php
echo "Today is " . date("d/m/y") . "<br>";
?>
</body>
</html>

OUTPUT:

Practical-18: Write a php program to check if number is prime


or not.
120130107005

Page 53

WAD

<?php
error_reporting(E_ALL);
if (isset($_REQUEST["txtInput"])){
$value = $_REQUEST["txtInput"];
$i = 2;
for ( ; $i <= $value; $I++){
if ($value % $I == 0){
break;
}
}
if ($value == $I){
echo "<center><h2>". $value ." is prime.</h2></center>";
}else{
echo "<center><h2>". $value ." is not prime.</h2></center>";
}
}
?>
<html>
<head>
<title>WAD Practical - 18</title>
120130107005

Page 54

WAD
<script language="javascript">
function checkValidate(){
if (document.getElementById("txtInput").value == ""){
alert("Input can not be empty.");
return false;
}
}
</script>
</head>
<body>
<form action="#" method="post" onsubmit="return checkValidate()">
<center>
<label for="txtInput">Enter number :</label><br/>
<input type="text" name="txtInput" id="txtInput" /><br/>
<input type="submit" name="submit" id="submit" value="submit"/>
</center>
</form>
</body>
</html>

OUTPUT:

120130107005

Page 55

WAD

Practical-19: Write a php program to print first 10 Fibonacci


Numbers.
120130107005

Page 56

WAD
<html>
<head>
<title>WAD Practical - 19</title>
</head>
<body>
<?php
error_reporting(E_ALL);
$I = 0;
$j = 1;
echo "<h2>First 10 Fibonacci numbers.<br/>\t". $I ."\t". $j . "\t";
for ($k = 2; $k < 10; $k++){
$temp = $I + $j;
echo $I + $j ."\t";
$I = $j;
$j = $temp;
}
echo "</h2>";
?>
</body>
</html>

120130107005

Page 57

WAD
OUTPUT:

Practical-20: Write PHP Script for storing and retrieving user


information from MySQL table
120130107005

Page 58

WAD
20.1.

Design a HTML page which takes Name,


Address, Email and Mobile No. From user (register.
Php )
20.2.
Store this data in MySQL database / text file.
20.3.
Next page display all user in html table using
PHP (display. Php )
index.php
<html>
<head>
<title>WAD Practical - 20</title>
<style type="text/css">
.input{
width: 300px;
}
textarea{
resize: none;
}
#submit{
width: 50%;
height: 50px;
margin-right: 15px;
font-family: Verdana;
font-size: 1.5em;
}
th, td{
font-family: Verdana; width: fixed;
}
</style>
<script type="text/javascript">
function validate(){

120130107005

Page 59

WAD
var address = document.getElementById("txtAddress");
if (address.value == "" || address.value == null){
alert("Address required.");
return false;
}
}
</script>
</head>
<body>
<center>
<h3>
<?php
if (isset($_COOKIE["r"])){
echo $_COOKIE["r"]; setcookie("r", "", time() - 3600);
}
?>
</h3>
<div width="50%" style="margin-left: 0em;">
<form method="post" action="register.php" onsubmit="return validate()">
<table border="0" cellpadding="2" cellspacing="5">
<tr>
<th colspan="2" align="center"><u>Student Information</u></th>
</tr>
<tr>
<th align="left">Student Name :</th>
<td><input type="text" class="input" name="txtName" id="txtName"
required/></td>
</tr>
<tr>
<th align="left" style="vertical-align: top;">Residential Address
:</th>
<td><textarea class="input" name="txtAddress" id="txtAddress"
requried></textarea></td>
</tr>

120130107005

Page 60

WAD
<tr>
<th align="left">Email address of student :</th>
<td><input
type="email"
class="input"
name="txtEmail"
id="txtEmail" required/></td>
</tr>
<tr>
<th align="left">Mobile No.:</th>
<td><input
type="text"
class="input"
name="txtMobile"
id="txtMobile" required/></td>
</tr>
<tr>
<td colspan="2" align="right"><input type="submit" name="submit"
id="submit" value="submit"/></td>
</tr>
</table>
</form>
</div>
<?php
include_once 'display.php';
?>
</center>
</body>
</html>
register.php
<?php
$conn = mysql_connect("localhost", "root", "") or die('Could not connect to
the Database; ' . mysql_error());
$db = mysql_select_db("test", $conn) or die('Could not select Database; ' .
mysql_error());
$stu_name = "";
$stu_address = "";
120130107005

Page 61

WAD
$stu_email = "";
$stu_mobile = "";
if (isset($_REQUEST["txtName"])){
$stu_name = $_REQUEST["txtName"];
}
if (isset($_REQUEST["txtAddress"])){
$stu_address = $_REQUEST["txtAddress"];
}
if (isset($_REQUEST["txtEmail"])){
$stu_email = $_REQUEST["txtEmail"];
}
if (isset($_REQUEST["txtMobile"])){
$stu_mobile = $_REQUEST["txtMobile"];
}
$query = "INSERT INTO student_info (name, address, email, mobile)
VALUES ('".$stu_name."', '".$stu_address."', '".$stu_email."', '".$stu_mobile."')";
if (mysql_query($query, $conn)){
setcookie("r", "Record Inserted Successfully.", time() + 3600);
header("Location: index.php");
}else{
die(mysql_error());
}
?>
display.php
<div width="50%" style="margin-right: 0em; overflow: scroll;">
<?php
$conn = mysql_connect("localhost", "root", "") or die('Could not
connect to the Database; ' . mysql_error());
$db = mysql_select_db("test", $conn) or die('Could not select
Database; ' . mysql_error());

120130107005

Page 62

WAD
$result = mysql_query("SELECT * FROM student_info");
?>
<table cellspacing="1" cellpadding="5" style="width: 100%;" border="0">
<tr>
<th>Sr.</th>
<th>Student Name</th>
<th>Residential Address</th>
<th>Email Address of Student</th>
<th>Mobile No.</th>
</tr>
<?php
$count = 0;
while ($row = mysql_fetch_array($result)){
echo "<tr>";
echo "<td>".(++$count)."</td>";
echo "<td>".$row['name']."</td>";
echo "<td>".$row['address']."</td>";
echo "<td>".$row['email']."</td>";
echo "<td>".$row['mobile']."</td>";
echo "<tr/>";
}
?>
</table>
</div>

OUTPUT:

120130107005

Page 63

WAD

Practical-21: Write a PHP script for user authentication using


PHP-MYSQL. Use session for storing username.

120130107005

Page 64

WAD

index.php
<?php
session_start();
?>
<html>
<head>
<title>WAD Practical - 21</title>
<style type="text/css">
.input{
width: 300px;
height: 30px;
margin: 5px 0px 5px 5px;
text-align: center;
}
#btnSubmit{
width: 200px;
height: 30px;
margin: 20px 0 0 120px;
}
label{
font-family: Verdana;
font-size: 1.2em;
width: 30px;
}
h4{
font-family: Verdana;
}
#submit{
width: 50%;
height: 50px;
margin-right: 15px;
font-family: Verdana;
120130107005

Page 65

WAD
font-size: 1.5em;
}
</style>
</head>
<body>
<center>
<?php
if (isset($_SESSION["loginUser"])){
echo
"Welcome:
<h1>".
$_SESSION["loginUser"]."</h1>&nbsp;&nbsp;<a
href='logout.php'>Logout</a>";
}else{
echo "<h4>User Authentication</h4>";
echo "<form action='login.php' method='post'>";
echo "<label for='txtUser'>Username :</label>";
echo "<input type='text' class='input' name='username' id='username'
placeholder='Enter Your Username' required/><br/>";
echo "<label for='txtPass'>Password :</label>";
echo "<input type='password' class='input' name='password'
id='password' placeholder='Enter Your Password' required/><br/>";
echo "<input type='submit' value='Submit' id='btnSubmit'/>";
echo "</form>";
}
?>
</center>
</body>
</html>
login.php
<?php
session_start();
$conn = mysql_connect("localhost", "root", "")
or die('Could not connect to the Database; ' . mysql_error());

120130107005

Page 66

WAD
$db = mysql_select_db("test", $conn)
or die('Could not select Database; ' . mysql_error());
if (isset($_POST["username"]) && isset($_POST["password"])){
$query = "select * from users where username ='".
$_POST["username"]."'";
$result = mysql_query($query) or die(mysql_error());
while($row = mysql_fetch_array($result)){
if ($row["username"] == $_POST["username"] &&
$row["password"] == $_POST["password"]){
$_SESSION["loginUser"] = $_POST["username"];
header("Location: index.php");
}else{
header("Location: index.php?er=0");
}
}
}else{
header("Location: index.php");
}
?>

logout.php
<?php
session_start();
session_destroy();
header("location: index.php");
?>

OUTPUT:

120130107005

Page 67

WAD

120130107005

Page 68

You might also like