Scribd
Upload
462 views

Webtech

Here is the code to design the web page with frames using HTML tags: <html> <frameset rows="15%,85%"> <frame src="header.html"> <frameset cols="25%,75%"> <frame src="leftmenu.html"> <frame src="main.html"> </frameset> </frameset> </html> header.html: <p style="color:blue"><b>CRC SOFTWARE SOLUTIONS</b></p> leftmenu.html: <p style="color:red"><b>About us</b></p> main.html: <p><u>

Uploaded by

tanush
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
462 views

Webtech

Here is the code to design the web page with frames using HTML tags: <html> <frameset rows="15%,85%"> <frame src="header.html"> <frameset cols="25%,75%"> <frame src="leftmenu.html"> <frame src="main.html"> </frameset> </frameset> </html> header.html: <p style="color:blue"><b>CRC SOFTWARE SOLUTIONS</b></p> leftmenu.html: <p style="color:red"><b>About us</b></p> main.html: <p><u>

Uploaded by

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

WEBTECHNOLOGY

1) Introduction to HTML and HTML text


a. Create a webpage that prints your name in green with Tahoma font in the screen
b. Provide its title to "Welcome page with current date”
c. Create a webpage that prints the numbers 1 - 10 to the screen from smallest to largest
each number being a different color and different font.
d. Display a part of your name with bold underline.
e. Print a paragraph that is a description of a book; include the title of the book as well
as its author. Names and titles should be underlined, adjectives should be italicized
and bolded.
f. Write a comment line on your code and make sure it is not displayed in the page
g. Print a2+b2=2ab and H2O in the next line
h. Display a c code as it is in the page
i. Set an image as background of the page
j. Apply marquee for your name
k. Display 2 paragraph contents using div.
l. Create the link at the top on the same page
m. Create mailto link to any email-id
n. Provide link from home page to Natalie page

<!DOCTYPE html>

<html>

<head>

<title>Welcome page with current date</title>

</head>

<body style=" height: 100%; color: white; background-position: center; background-repeat: no-
repeat; background-size: cover; background-image :url(code1.jpg)">

<marquee style = "color:blue; font-family:Tahoma;">

Oppo<b> Iphone </b>Samsung

</marquee>

<p><a href="natalie.html" style="color: coral;">Numbers</a></p>

<p ><a href="mailto:[email protected]?Subject=AAA%20again" target="_top"


style="color: coral;">Mail</a></p><hr>

<p>

<u>Harry Potter</u> s a series of fantasy novels

<i><b>written</b></i> by British author <u>J. K. Rowling</u>.

The novels <i><b>chronicle</b></i> the lives of a young wizard,


<u>Harry Potter</u>, and his friends <u>Hermione Granger</u> and

<u>Ron Weasley</u>, all of whom <i><b>are </b></i> students at

<u>Hogwarts School of Witchcraft and Wizardry</u>

</p>

<!-- This is a comment -->

<p>a<sup>2</sup>+b<sup>2</sup>=2ab</p>

<p>H<sub>2</sub>O</p>

<br><br>

<p>

#include<stdio.h>

int main()

printf("Hello world!");

return 0;

</p>

<div style="padding: 20px; border-radius: 5px; background-color: #880E4F; margin: 10px; font-
family: Tahoma;">

Iphone at the top

</div>

<div style="padding: 20px; border-radius: 5px; background-color: #004D40; margin: 10px; font-
family: Tahoma;">

Samsung loses its market

</div>

</body>

</html>
2.

<html>

<head>

<title> WEB FORM </title>

<body style = "background-color:#cafc67" align = center>

<h2 align=CENTER><b> Personal Details </b></h1>

<center>

<hr>

<form>

Name: <input type="text" name="name"><br><br>

Password: <input type="password" name="password" maxlength="10"><br><br>

E-mail id: <input type="text" name="emailId"><br><br>

Gender : <input type="radio" name="male" id="male"><label for="male"> Male</label>

<input type="radio" name="female" id="female" checked><label


for="female">Female</label><br><br>

Contact#: <input type="text" name="contact" maxlength="14"><br>

<h2 align=CENTER><b> Educational Qualification </b></h2><hr>

Degree: <select name="degree" size="1">

<option value="s"> --Select Group--</option>

<option value="u">UG</option>

<option value="p">PG</option>

<option value="d">P.hd</option>

</select><br><br>
Engineering: <select name="engineering" size="1">

<option value="s1"> --Select Group--</option>

<option value="cse"> CSE</option>

<option value="ece"> EEE</option>

<option value="eee"> ECE</option>

<option value="iee"> MECH</option>

</select><br><br>

Hobbies: <input type="checkbox" name="h" id="h"><label for="h">Playing Chess </label>

<input type="checkbox" name ="ho" id="ho"><label for="ho"> Reading


Books</label><br><br>

<h2 align=CENTER><b> Address</b></h2><hr>

<label for="add"></label>

<textarea name="add" id="add" rows="10" columns="200">

Enter Address here

</textarea><br><br>

Attach Resume: <input type="button" name="CF" value="ChooseFile" id="CF"><br><br>

<input type="submit" value="SUBMIT"

</form>

</center>

</body>

</head>

</html>
3.

<html>

<head>

<title> lists </title>

</head>

<body>

<h1><b> The Great American Novel </b></h1>

<ol type="I">

<li> Introduction </li>

<ol type="A">

<li> Boy's Childhood </li>

<li> Girl's Childhood </li>

</ol>

<li>Development</li>

<ol type="A">

<li> Boy meets Girl</li>

<li> Boy and Girl have fall in love </li>

<li> Boy and Girl have a fight </li>

</ol>

<li> Climax </li>

<ol type="A">

<li> Boy give Girl ultimatum </li>

<ol type="1">

<li> Girl can't believe her eyes </li>

<li> Boy is indignant at girs'sindignance</li>

</ol>

<li> Girl tells Boy to get lost</li>

</ol>

<li> Denouement </li>


<li> Epilogue </li>

</ol>

</body>

</html>

4.

<html>

<head>

<title> HTML Table </title>

</head>

<body>

<font face="Cambria">

<table border="1", cellpadding="10">

<tr bgcolor="14FC97">

<th> </th>

<th> Apple </th>

<th> Banana </th>

<th> Grapes </th>

<th> Orange </th>

</tr>

<tr bgcolor="skyblue">

<td> Year 2013 </td>

<td> 300 </td>

<td> 200 </td>


<td> 150 </td>

<td> 130 </td>

</tr>

</tr>

<tr bgcolor="white">

<td> Year 2012 </td>

<td> 150 </td>

<td> 130 </td>

<td> 120 </td>

<td> 220 </td>

</tr>

</tr>

<tr bgcolor="skyblue">

<td> Year 2011 </td>

<td> 100 </td>

<td> 120 </td>

<td> 160 </td>

<td> 200 </td>

</tr>

</tr>

<tr bgcolor="white">

<td> Year 2010 </td>

<td> 200 </td>

<td> 300 </td>

<td> 200 </td>

<td> 150 </td>

</tr>

</table>

</font>
</body>

</html>

RESUME

Code:

<html>

<head>

<title>Resume</title>

<link rel="stylesheet" type="text/css" href="style.css">

</head>

<body>

<table border="3%">

<thead>

<tr>

<div class="hack">

<th ><img src="C:\Users\User\Desktop\html/crop.jpg" style="max-


height:50%; max-width: 50%; "></th>

</div>

<th width="1000" height="5">

<form align="left">

<div class="mack">

<div>

<label>Name:

</label>

<input type="text" value="Mega Dharani">

</div>
<br>

<div>

<label>Address:

</label>

<input type="text"

value="9 Anna Nagar Dindigul"

</div>

<br>

<div>

<label>mobile:

</label>

<input type="number" value="9500530488">

</div>

<br>

<label>

Mail-Id:

</label>

<input type="text" value="[email protected]">

</div>

</form>

</th>

</tr>

</thead>

</table>

<div class="kack">

<h1>Profile:

</h1>

<p>

<ul>good leadership quality</ul>


<ul>specialist in c</ul>

<ul>good in java</ul>

</p>

<h1>Education summary</h1>

</div>

<table border="2%">

<thead>

<tr>

<th>Degree</th>

<th>Discipline</th>

<th>University</th>

<th>Year Of Passing</th>

<th>Marks Obtained</th>

</tr>

</thead>

<tbody>

<td>Mtech Integrated</td>

<td>Software Engineering</td>

<td>Vellore Institute of Technology</td>

<td>2022</td>

<td>90%</td>

</table>

<br>

<form class="jack" >

<div class="myform">

<div>

<label>Area Of Interest</label>

<input type="text">

</div>
<br>

<div>

<label>Academic Excellence</label>

<input type="text" >

</div>

<br>

<div>

<label>Involvement in certification</label>

<input type="text" >

</div>

<br>

<div>

<label>Membership</label>

<input type="text">

</div>

<br>

<div>

<label>Personal details</label>

<textarea></textarea>

</div>

</div>

</form>

<div class="pack1">

<h1>Date</h1>

<input type="Date">

</div>

<div class="pack">

<h1 align="right" >Signature</h1>

<input type="text">
<div class="pack">

</body>

</html>

css code:

*{

background-color:white;

color: blue;

.hack{

max-height:auto;

max-width: 20%;

.jack{

padding: 10px;

.jack.myform{

padding-bottom: 5px;

.myform input{

padding: 8px;

width: 100%;

.mack input{

padding: 8px;

width: 80%;

.kack h1{

font-size:25;

font-family: "tahoma";
}

.kack ul{

font-size: 21;

.pack h1{

position:relative;

bottom:80px;

right: 200px;

.pack input{

position: relative;

bottom:70px;

left: 1000px;

.pack1 h1{

position: relative;

bottom: 10px;

left: 20px;

OUTPUT:
WEBTECHNOLOGY

LAB-3
HTML Web page

1. Write a code to design the following web page with HTML tags using FRAME.

A1)

<html>

<head>

<title> Mypage </title>

</head>

<body>

<p style="color:blue"><b>CRC SOFTWARE SOLUTIONS</b></p>

<p style="color:red"><b>About us</b></p>

<p><u><font color="blue">contact infromation</u></p>

<p><font color="black">services</p>

<p>Hours of operation</p>

<p>Product Descriptions</p>

<ol>

<li style="color:darkgreen">Product 1.Description

<li style="color:darkgreen">Product 2.Description

<li style="color:darkgreen">Product 3.Description

</ol>
</body>

</html>

A2)

<html>

<head>

<title> Mypage </title>

</head>

<body>

<p style="color:blue"><b>CRC SOFTWARE SOLUTIONS</b></p>

<p style="color:red"><b>CORPORATE SUMMARY<b></p>

<p>Electronic products and softwars is a leading online retailer committed</p>

<p>to Beoming the most loved and trusted Marketplace on the web.we tirelessly pursue these
goals

</p>

<p>by offering the Superior shopping Experience, rapid delivery and stellar customer
service</p><br>

<p>With more than 1000s products and an award website,electronic products and softwares
proudly

</p>

<p>earns the loyalty of e-shoppers alike.We offer our customers peace of mind with lightning
fast delivery and cutting-edge logistics

</p>

</body>

</html>

A3)

<html>

<head>

<title> Mypage </title>

</head>

<body>
<p style="color:blue"><b>CONTACT INFORMATION</b></p>

<p>4837 Blind bay road</p>

<p>Celista,BC VOE 1LO</p>

<p>250-955-5462</p>

<br>

<p>For any difficulties or Questions you might have regarding out</p>

<p>website and services please contact our Support team</p>

</body>

</html>

A4)

<html>

<head>

<title> Mypage </title>

</head>

<body>

<p style="color:red"><b>Any Feedback</b></p>

<br>

<textarea row="500" cols="50">

</textarea>

</body>

</html>

A5)

<html>

<frameset cols="30%,70%">

<frame src="a1.html">

<frameset rows="50%,50%">

<frame src="a2.html">

<frameset cols="50%,50%">

<frame src="a3.html">
<frame src="a4.html">

</html>

2. Design the below HTML web page using necessary tagsw

B1)

<html>

<head>

<title> Mypage </title>

</head>

<body bgcolor="sky blue">

<h1><font color="white">Your Site Name</h1>

<h2><font color="black">Your Slogan Comes Here</h2>

</body>

</html>

B2)

<html>

<body bgcolor="sky blue">

<h1><font color="white">HOME | ABOUT US | SPORTS | EVENTS | CONTACT US</h1>

</body>

</html>
B3)

<html>

<head>

<title> Mypage </title>

</head>

<body>

<p ><font color="sky blue"><b>Website Add-Ons</b></p>

<p><font color="black">Check out our easy to integrate Web site Add-Ons!<p>

<ul type="square">

<li>Smart Survey</li>

<li>Smart Multi Poll</li>

<li>Smart Poll</li>

<li>Smart Guest Book</li>

<li>Smart Quote</li>

</ul>

</body>

</html>

B4)

<html>

<head>

<title> Mypage </title>

</head>

<body>

<p><font color="blue"><b>Features Of This CSS Sports Template</b></p>

<ul type="square"><font color="black">

<li>Neat Attractive sports wweb template designed using cool colours</li>

<li>Optimized,fast-loading and W3C certified valid CSS & HTML code</li>

<li>Rollover TextLines And Easy-to-use Drop Down Menus</li>

<li>Tableless layout CSS design.All 8 Linked HTML Pages included</li>


<li>Cross Browser compatible:Tested for Internet Explorer 5+,Netspace 6+,Opera 7+</li>

<li>Designed to stretch and fit all resolutions(800x600 and Higher)</li>

</ul>

<br>

<p><b>Buy Now for only $69.95! <u><font color="blue">Add to cart</u></b></p>

<br>

<p><font color="black">Smart Webby offers professional web templates at


afforadableprices.choose from a variety of high quality website designs.<u><font
color="blue">More templates from SmartWebby.com</u></p>

</body>

</html>

B5)

<html>

<head>

<title> Mypage </title>

</head>

<body bgcolor="sky blue">

<p><font color="white">Copyright www.yoursitename.com - All Rights Reserved.Designed


by SmartWebby.com</p>

</body>

</html>

B7)

<html>

<head>

<title> Mypage </title>

</head>

<body>

<imgsrc ="s2.jpg" width="200" height="200">

</body>

</html>
B6)

<html>

<title>

SmartWebby.com dreamweaver Templates - High quality dreamweaver templates for purchase


&instan - Windows Internet

</title>

<frameset rows="10%,80%,10%">

<frameset cols="30%,20%,50%">

<frame src="b1.html">

<frame src="b7.html">

<frame src="b2.html">

</frameset>

<frameset cols="*,*">

<frame src="b3.html">

<frame src="b4.html">

</frameset>

<frame src="b5.html">

</frameset>

</html>

LAB-4
CODE:

<html>
<head>

<style type="text/css">

h1{color:white;text-align:center;size:170px;font-family:verdana}

h2{color:white;text-align:center;size:90px;font-family:verdana}

p{color:white;font-family:verdana;}

</style>

</head>

<body bgcolor="#001f3f" >

<h1>TELL ME ABOUT YOURSELF</h1>

<hr>

<h2>PERSONAL DETAILS</h2>

<p>Name:Mega Dharani</p>

<p>Age:19</hp>

<p>Mail Id:[email protected]</p>

<p>Hometown:Dindigul</p>

<hr>

<h2>EDUCATION DETAILS</h2>

<p>College: Vellore Institute of Technology</p>

<p>Course:Mtech Integrated Software Engineering

<p>Year:2017-2022</p>

<p>CGPA:8.7</p>

<p>Club Activity:NSS</p>

<p>Good in Java</p>

<hr>

<h2>FAVOURITES</h2>

<p>Favourite Color:Blue,Violet</p>

<p>Favourite Actor:Vijay</p>

<p>Favourite Food:Biriyani</p>

<p>Hobby:Reading Books</p>
<hr>

</body>

</html>

LAB-5
1.
<!DOCTYPE html>
<html>
<head>
<title>Sample</title>
</head>
<body>
<img src="C:\Users\eg2\Desktop\k/indialarge.gif" alt="" usemap="#jmap">
<map name="jmap">
<area shape="rect" coords="200,200,400,400"
href="https://en.wikipedia.org/wiki/Punjab,_India" target="_blank" alt="face">
<area shape="circle" coords="400,700,100"
href="https://en.wikipedia.org/wiki/Madhya_Pradesh" target="_blank" alt="chest">
<area shape="circle" coords="400,100,100"
href="https://en.wikipedia.org/wiki/Kashmir" target="_blank" alt="forehead">
<area shape="poly"
coords="1000,1000,500,500,500,203,227,542,207,248,403,109"
href="https://en.wikipedia.org/wiki/Jharkhand" target="_blank" alt="india">
<area shape="circle" coords="446,1288,100"
href="https://en.wikipedia.org/wiki/Tamil_Nadu" target="_blank" alt="forehead">
<area shape="circle" coords="285,865,100"
href="https://en.wikipedia.org/wiki/Maharashtra" target="_blank" alt="forehead">
<area shape="circle" coords="683,762,100"
href="https://en.wikipedia.org/wiki/Chhattisgarh" target="_blank" alt="">
<area shape="circle" coords="474,1012,100"
href="https://en.wikipedia.org/wiki/Andra_pradesh" target="_blank" alt="">
<area shape="circle" coords="1077,525,100"
href="https://en.wikipedia.org/wiki/Assam" target="_blank" alt="">
<area shape="circle" coords="331,1094,100"
href="https://en.wikipedia.org/wiki/Karnataka" target="_blank" alt="">
<area shape="circle" coords="350,1302,100"
href="https://en.wikipedia.org/wiki/Kerala" target="_blank" alt="">
<area shape="circle" coords="707,801,100"
href="https://en.wikipedia.org/wiki/Odisha" target="_blank" alt="">
<area shape="circle" coords="886,714,100"
href="https://en.wikipedia.org/wiki/West_Bengal" target="_blank" alt="">
<area shape="circle" coords="170,688,100"
href="https://en.wikipedia.org/wiki/Gujarat" target="_blank" alt="">
<area shape="circle" coords="802,571,100"
href="https://en.wikipedia.org/wiki/Bihar" target="_blank" alt="">
<area shape="circle" coords="578,518,100"
href="https://en.wikipedia.org/wiki/Uttar_Pradesh" target="_blank" alt="">
<area shape="circle" coords="524,353,100"
href="https://en.wikipedia.org/wiki/Uttarakhand" target="_blank" alt="">
<area shape="circle" coords="265,508,100"
href="https://en.wikipedia.org/wiki/rajasthan" target="_blank" alt="">
<area shape="circle" coords="395,394,100"
href="https://en.wikipedia.org/wiki/Haryana" target="_blank" alt="">
<area shape="circle" coords="436,271,100"
href="https://en.wikipedia.org/wiki/Himanchal_pradesh" target="_blank" alt="">
<area shape="circle" coords="330,1082,100"
href="https://en.wikipedia.org/wiki/Karnataka" target="_blank" alt="">
<area shape="circle" coords="1183,481,100"
href="https://en.wikipedia.org/wiki/Arunchal_pradesh" target="_blank" alt="">
</map>
</body>
</html>
2.
<html>
<head>
</head>
<body style="background-color:red",>
<h1> MANCHESTER UNITED</h1>
<p>Manchester United have won more trophies than any other club in English football, with a
record 20 League titles, 12 FA Cups, 5 League Cups and a record 21 FA Community Shields.
United have also won three UEFA Champions Leagues, one UEFA Europa League, one UEFA
Cup Winners' Cup, one UEFA Super Cup, one Intercontinental Cup and one FIFA Club World
Cup. In 1998–99, the club became the first in the history of English football to achieve the
continental European treble. By winning the UEFA Europa League in 2016–17, they became one
of five clubs to have won all three main UEFA club competitions, and the only English club to
have won every competition available to them.</p>
<html>
<head>
<title> sample</title>
</head>
<body style="background-color:powderblue;">
<h1> Manchester city</h1>
<p>Having regained their Premier League status in the early 2000s, Manchester City was
purchased in 2008 by Abu Dhabi United Group for £210 million, receiving considerable
investment. The club subsequently won several trophies in the 2010s, and also became the only
team to attain 100 points in a season.
Manchester City's revenue was the fifth highest of a football club in the world in the 2017–18
season at €527.7 million.[4][5] In 2018, Forbes estimated the club was the fifth most valuable in
the world at $2.47 billion<p>
</body>
</html>
<html>
<head>
</head>
<body style="background-color:blue",>
<h1> CHELSEA</h1>
<p>Chelsea Football Club is a professional football club based in London, England, that
competes in the Premier League, the highest tier of English football. The club has won eight
League titles, eight FA Cups, five League Cups, four FA Community Shields, one UEFA Europa
League, one UEFA Super Cup, one UEFA Cup Winners' Cup, and one UEFA Champions
League</p>
</body>
</html>

<!DOCTYPE html>
<html>
<head>
<title>Frames</title>
</head>
<frameset cols="25%,*,25%">
<frame src="frames2.html"></frame>
<frame src="manu.html"></frame>
<frameset rows="50%,50%">
<frame src="manc.html"></frame>
<frame src="che.html"></frame>
</frameset>
<body>
</body>
</html>
3)
<html>
<head></head>
<body style="background-color:blue",>
<imgsrc="img.jpg" width="90%" height="60%">
<p>This is to celebrate the 50th birthday of AAA to wish him for a long and happy life</p>
<p> All family friends are invited for a fun filled evening with delicious food</p>
</body>
</html>

<html>
<head></head>
<body style="background-color:yellow",>
<h1 align="center"> WE WANT YOU ALL HERE ON </h1>
<p align="center">Crownpark , 2nd floor</p>
<p align="center"> Near SRM college ,Kattagalathur</p>
<p align="center"> 6pm on 24th Feb</p>
<imgsrc="img1.jpg" width="90%" height="60%">
</body>
</html>

<!DOCTYPE html>
<html>
<head>
<title> INVITATION CARD </title>
</head>
<body style="background-color:powderblue;">
<font style="font-family:cambria"> HAPPY BIRTHDAY!!!</font>
<p> We wish you a very Happy Birthday!</p>
The fun activities we have today are:
<li>lemon in the spoon</li>
<li>birthday bash</li>
<li>dumsharus</li>
<imgsrc="img2.jpg" width="90%" height="90%" left="20%">
</ul>
</body>
</html>

<!DOCTYPE html>
<html>
<head>
<title> INVITATION CARD </title>
</head>
<frameset cols="25%,*,25%">
<frame src="a.html">
<frame src="b.html">
<frame src="c.html">
</frameset>
</html>

LAB-6
1. Create a HTML page for vibrance with the following items listed in it using internal
CSS.

Background image with vibrance logo and use border properties groove,
width and color.

Vit logo at the top of the page


Login at the right corner of the page

Describe about the vibrance event using Box model and use necessary font
properties (displayed in the center of the page).

<html>

<head>

<style type="text/css">

body{

background-image:url("img/vib.jpg");

background-repeat:no-repeat;

background-position:relative;

background-size:100%;

</style>

<link rel="stylesheet" type="text/css" href="b.css">

</head>

<body>

<div class="b" >

<img src="img/vitlogo.png" height=40% >

</div>

<div class="k" align="right">

<form>

<label style="color:white">LOGIN</label>

<input type="text" >

</div>

<div align="right">

<label style="color:white"> PASSWORD</label>

<input type="text">

</div>

<div class="la">
<p style="align:center" >

Rice bucket challenge

<br>

Amount for rice is collected from the students and staff and rice is bought

for the amount collected and donated to orphanages

<br>

Slow Cycling

<br>

A fun filled activity where the participants will ride cycles in a straight line

the one who can ride the slowest wins

<br>

</p>

</div>

</body>

</html>

.la{

border:08px solid white;

width:500px;

margin:90px 350px;

color:white;

text-align:center;

background:rgba(0,0,0,0.6);

padding:50px;

font-family: 10px cambria,arial;

}
2. Create a Inline CSS to print your name, educational qualification, age and email ID
with hyper link. Also underline all links inside listed items.

<!DOCTYPE html>
<html>
<head>
<title>Inline css</title>
<style type="text/css">
Body
{
text-align: center;
font-size: 30px
}
</style>
</head>
<body>
<a href="www.google.com" style="color: blue" align="center">Name:R.Mega
Dharani</a>
<br>
<br>
<br>
<a href="google.com" style="color: green">Educational Qualification:Mtech Integrated
Software Engineering</a>
<br>
<br>
<br>
<a href="google.com" style="color: red">Age:18</a>
<br>
<br>
<br>
<a href="https.//www.gmail.com" style="color: black">Email
ID:[email protected] </a>

</body>

</html>
3. Create a internal CSS to print the following

<html>

<head>

<title>Sample</title>

<style type="text/css">

body{

background-color:rgb(197,149,223);

</style>

<link rel="stylesheet" type="text/css" href="lab1.css">

</head>

<body>

<div class="j">

<h2 align="center">Creating A</h2>

</div>

<div class="k">

<h1 align="center">Spreadsheet</h1>

</div>

<div class="l">

<h1 align="center">Table Of Contents</h1>

</div>

<div class="m">

<form>

<table>
<tr>

<td> <input type="checkbox" name=""> </td>

<td> <input type="text" name=""></td>

</tr>

<tr>

<td> <input type="checkbox" name=""> </td>

<td> <input type="text" name=""></td>

</tr>

<tr>

<td> <input type="checkbox" name=""> </td>

<td> <input type="text" name=""></td>

</tr>

<tr>

<td> <input type="checkbox" name=""> </td>

<td> <input type="text" name=""></td>

</tr>

</table>

</form>

</div>

<div class="b">

<img src="bomb.jpg" width="3%" height="">

</div>

<div class="n">

<p>TheSpreadSheetGuru.com</p>

</div>

</body>

</html>

.j{

position: relative;
top: 170px;

left: -140px;

font-size: 20px;

color: rgb(111,109,103);

.k{

position: relative;

top: 90px;

left:60px;

font-size: 25px;

font-style: italic;

color: white;

.l{

position: relative;

top:60px;

left: 20px;

font-size: 30px;

word-spacing: 20px;

color: rgb(43,43,41);

.m{

position: relative;

top: -100px;

left: 220px;

.n{

position: relative;

left: 1100px;
bottom:-200px;

font-size: 20px;

.b{

position: relative;

left: 1050px;

bottom:-250px;

LAB-7
1. A General Service company hired you to calculate the labour cost and total charge
for the services rendered to their client based on the formula given below:
Rate per hour : Rs.45/- Labour cost : Rate * hours work
Total Charge :Labour cost + Cost of Materials.
Write a Javascript program using suitable pop up boxes to read the necessary
inputs and display the output.

<html>
<head>
<title>Sample</title>
</head>
<form name="f1">
<script>
function calc()
{
var value1=parseInt(document.f1.hrs.value)
var value2=parseInt(document.f1.cost.value)
var labour_cost
labour_cost=45*value1
var total1=labour_cost+value2
alert(total1)
}
</script>
<body>
<center><h1>General Service Comapny</h1></center>
<br>
<center>
No.Of.Hours Worked: <input type="text" name="hrs">
<br>
<br>
Cost of the Material: <input type="text" name="cost">
<br>
<br>
Total Cost:<input type="text" name="total" readonly>
<br>
<br>
<button onclick="calc()">Calculate</button>
<br>
<br>
</center>
</form>
</body>
</html>

2. Write a program that reads a value from the user and displays the even numbers
between 1 and the value provided by the user. The values should be printed in an
HTML table.

<html>
<body>
<center>
<form name="even">
<input type="text" name="e"placeholder="enter a number">
<button onclick="evn()">calculate</button>
<script>
function evn()
{
var a=document.even.e.value;
var mytable = "<table border=2>";
for (var i = 1; i < a; i++) {
if (i %2 == 0)
{
mytable += "<tr><td>"+i+"</td></tr>";
}
}
mytable += "</tbody></table>";
document.write(mytable);
</script>
</form>
</center>
</body>
</html>

3. The following are the daily temperature recordings of NEWYORK


city(InFahrenheit)
55,62,68,74,59,45,41,58,60,67,65,78,82,88,91,92,90,93,87,80,78,79,72,68,61,59,55,65
Your JS program should count and print the number of HOT days (High
Temperature: 85 or higher), the number of PLEASANT days (High temperature:
60-84) and the number of COLD days (High temperature<60) in the city. It should
also display the category of each temperature.

<!DOCTYPE html>
<html>
<body>
<p id="temp"></p>
<script type="text/javascript">
var tempNY =
[55,62,68,74,59,45,41,58,60,67,65,78,82,88,91,92,90,93,87,80,78,79,72,68,61,59,55,65];
var Hot = 0;
var Cold = 0;
var Pleasant = 0;
var i;
for (i = 0; i < tempNY.length; i++)
{
if(tempNY[i]>84)
{
Hot++;
document.write(tempNY[i] + " is Hot<br>");
}
else if(tempNY[i]>60)
{
Pleasant++;
document.write(tempNY[i] + " is Pleasant<br>");
}
else
{
Cold++;
document.write(tempNY[i] + " is Cold<br>");
}
}
document.write("Number of Hot days : " + Hot + "<br>");
document.write("Number of Pleasant days : " + Pleasant + "<br>");
document.write("Number of Cold days : " + Cold + "<br>");
document.getElementById("temp").innerHTML = text;
</script>
</body>
</html>
4. A small airline has just purchased a computer for its newly automated reservations
system. Write a JS program to assign seats on each flight (capacity: 10 seats).Your
program should display the following:
 If the person types 1, assign a seat in the first-class section (seats 1–5).
 If the person types 2, assign a seat in the economy section (seats 6–10).
 When the first-class section is full, your program should ask the person if it is
acceptable to be placed in the economy section (and vice versa)
Allot the seats based on the above choices. Print a boarding pass indicating the person’s
name, seat number and class
Use a one-dimensional array to represent the seating chart of the plane. Initialize all the
elements of the array to 0 to indicate that all the seats are empty. As each seat is assigned,
set the corresponding elements of the array to 1 to indicate that the seat is no longer
available.

<!DOCTYPE html>
<html>
<body>
<script type="text/javascript">
var seatSection, totalSeatsTaken = 0;
seatsAvailable = [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
function check()
{
seatSection = parseInt(document.getElementById('number').value);
if(totalSeatsTaken == seatsAvailable.length - 1)
{
alert("No seats available!");
return;
}
if (seatSection == 1)
{
firstClass();
}
else if (seatSection == 2)
{
economy();
}
else
{
other()
}
}
function firstclass()
{
var seatFound = false;
for (var i = 1; i <= 5; i++)
{
if (seatsAvailable[i] == 0)
{
alert("It has been assigned to first class seat " + i);
seatsAvailable[i] = 1;
seatFound = true;
totalSeatsTaken += 1;
break;
}
}
if (!seatFound && confirm("There are no more first class seats available.Would you like an
economy class seat?"))
{
economy();
}
}
function economy()
{
var seatFound = false;
for (var i = 6; i <= 10; i++)
{
if (seatsAvailable[i] == 0)
{
alert("It has been assigned to economy seat " + i);
seatsAvailable[i] = 1;
seatFound = true;
totalSeatsTaken += 1;
break;
}
}
if (!seatFound && confirm("There are no more economy class seats available. Would you like
an first class seat?"))
{
first();
}
}
function other()
{
alert("Wrong number");
}
</script>
<form id="form">
<p>Please type 1 for First Class</p>
<p>Please type 2 for Economy</p>
<input style="border-radius:3px" id="number" type="text" size="5">
<br>
<input type="button" value="Make Reservation" onclick="check()">
</form>
</body>
</html>
LAB-8
*Events and Functions:

1. Display the below information in a web page using JS arrays. Sort the table based
on longitude and display the sorted information, sum, average, maximum, minimum
of latitude along with its State and capital using any five JS events and functions.

<html>

<head>

<title>Javascript Array</title>

<style type="text/css">

h2{

position: relative;

left: 02%;

</style>

<script>

window.onload = init;

function init(){

document.getElementById("sort").onclick = sortTable;

function sortTable() {

var table, rows, switching, i, x, y, shouldSwitch;

table = document.getElementById("myTable");

switching = true;

while (switching) {

switching = false;

rows = table.rows;

for (i = 1; i < (rows.length - 1); i++) {

shouldSwitch = false;

x = rows[i].getElementsByTagName("TD")[4];

y = rows[i + 1].getElementsByTagName("TD")[4];
if (parseInt(x.innerHTML) > parseInt(y.innerHTML)) {

shouldSwitch = true;

break;

if (shouldSwitch) {

rows[i].parentNode.insertBefore(rows[i + 1], rows[i]);

switching = true;

</script>

</head>

<body>

<h2 style="color: darkblue">Coordinates Of State Capitals</h2>

<table border="1px" id="myTable">

<thead style="background-color: lightblue">

<tr>

<th style="color: darkblue">Capital</th>

<th style="color: darkblue">State</th>

<th style="color: darkblue">Code</th>

<th style="color: darkblue">Latitude</th>

<th style="color: darkblue">Longitude</th>

</tr>

</thead>

<tbody>

<tr>

<td>Montgomery</td>

<td>Alabama</td>
<td>AL</td>

<td>32</td>

<td>-86</td>

</tr>

<tr>

<td>Juneau</td>

<td>Alaska</td>

<td>AK</td>

<td>58</td>

<td>-134</td>

</tr>

<tr>

<td>Phoenix</td>

<td>Arizona</td>

<td>AZ</td>

<td>33</td>

<td>-113</td>

</tr>

<tr>

<td>Little Rock</td>

<td>Arkansas</td>

<td>AR</td>

<td>35</td>

<td>-92</td>

</tr>

<tr>

<td>Sacramento</td>

<td>California</td>

<td>CA</td>
<td>38</td>

<td>-121</td>

</tr>

<tr>

<td>Denver</td>

<td>Colorado</td>

<td>CO</td>

<td>40</td>

<td>-105</td>

</tr>

<tr>

<td>Hartford</td>

<td>Connecticut</td>

<td>CT</td>

<td>42</td>

<td>-73</td>

</tr>

<tr>

<td>Dover</td>

<td>Delaware</td>

<td>DE</td>

<td>39</td>

<td>-76</td>

</tr>

<tr>

<td>Tallahassee</td>

<td>Florida</td>

<td>FL</td>

<td>31</td>
<td>-84</td>

</tr>

<tr>

<td>Atlanta</td>

<td>Georgia</td>

<td>GA</td>

<td>34</td>

<td>-84</td>

</tr>

</tbody>

</table>

<input type=button value="Sort" id="sort">

</body>

</html>

*Form validation:

2. Design the below form and validate the following

a. * - Mandatory Fields
b. Name should not have a maximum of 20 characters
c. Address – to be specified in Text Area
d. Zip code should be numeric and validated the maximum digits
e. Phone numbers should be numeric and of 10 digits
f. e-mail syntax should be validated
g. Password should contain a number or a character
h. PAN card number – Textbox (validate such that the PAN number is 10 digits and
follows the pattern)

<html lang="en">
<head>
<meta charset="utf-8">
<title>HTML Form Input Validation Using JavaScript</title>
<link rel="stylesheet" href="Design.css">
<script src="Javascript.js">
</script>
</head>
<body>
<h2>Test JavaScript Form Validation</h2>
<form id="formTest" method="get" action="processData">
<table>
<tr>
<td><label for="txtName">Name<span class="required">*</span></label></td>
<td><input type="text" id="txtName" name="name"></td>
<td id="elmNameError" class="errorMsg">&nbsp;</td></tr>
<tr>
<td><label for="txtAddress">Address</label></td>
<td><input type="text" id="txtAddress" name="address"></td>
<td id="elmAddressError" class="errorMsg">&nbsp;</td></tr>
<tr>
<td><labelfor="txtZipcode">ZipCode<span class="required">*</span></label></td>
<td><input type="text" id="txtZipcode" name="zipcode"></td>
<td id="elmZipcodeError" class="errorMsg">&nbsp;</td></tr>
<tr>
<td>Country<span class="required">*</span></td>
<td><select id="selCountry" name="country">
<option value="" selected>Please select...</option>
<option value="AA">AA</option>
<option value="BB">BB</option>
<option value="CC">CC</option>
</select></td>
<td id="elmCountryError" class="errorMsg">&nbsp;</td></tr>
<tr>
<td>Gender<span class="required">*</span></td>
<td><label><input type="radio" name="gender" value="m">Male</label></td>
<td><label><input type="radio" name="gender" value="f">Female</label></td>
<td id="elmGenderError" class="errorMsg">&nbsp;</td></tr>
<tr>
<td>Preferences<span class="required">*</span></td>
<td><label><input type="checkbox" name="color" value="r">Red</label></td>
<td><label><input type="checkbox" name="color" value="g">Green</label></td>
<td><label><input type="checkbox" name="color" value="b">Blue</label></td>
<td id="elmColorError" class="errorMsg">&nbsp;</td></tr>
<tr>
<td><label for="txtPhone">Phone<span class="required">*</span></label></td>
<td><input type="text" id="txtPhone" name="phone"></td>
<td id="elmPhoneError" class="errorMsg">&nbsp;</td></tr>
<tr>
<td><label for="txtEmail">Email<span class="required">*</span></label></td>
<td><input type="text" id="txtEmail" name="email"></td>
<td id="elmEmailError" class="errorMsg">&nbsp;</td></tr>
<tr>
<td><label for="txtPan">Pan</label></td>
<td><input type="text" id="txtPan" name="pan"></td>
<td id="elmPanError" class="errorMsg">&nbsp;</td></tr>
<tr>
<td><labelfor="txtPassword">Password(6-8characters)<span
class="required">*</span></label></td>
<td><input type="password" id="txtPassword" name="password"></td>
<td id="elmPasswordError" class="errorMsg">&nbsp;</td></tr>
<tr>
<td><labelfor="txtPWVerified">VerifyPassword<span class="required">*</span></label></td>
<td><input type="password" id="txtPWVerified" name="pwVerified"></td>
<td id="elmPWVerifiedError" class="errorMsg">&nbsp;</td></tr>
<tr>
<td>&nbsp;</td>
<td><input type="submit" value="SEND" id="btnSubmit">&nbsp;
<input type="reset" value="CLEAR" id="btnReset"></td>
<td>&nbsp;</td></tr>
</table>
</form>
</body>
</html>

.required {
color: red;
}

.errorMsg {
color: red;
}

.errorBox {
border: 2px solid red;
}

table {
border: 0;
}

td {
margin: 0;
padding: 3px 10px;
}

window.onload = init;
function init() {
document.getElementById("formTest").onsubmit = validateForm;
document.getElementById("btnReset").onclick = clearForm;
document.getElementById("txtName").focus();
}
function validateForm(theForm) {
with(theForm) {
return (isNotEmpty(txtName, "Please enter your name!", elmNameError)
&& isLengthMinMax(txtName, 1, 20, "Please enter below 20 characters!", elmNameError)
&& isNumeric(txtZipcode, "Please enter a valid zip code!", elmZipcodeError)
&& isLengthMinMax(txtZipcode, 6, 6, "Please enter a 6-digit zip code!", elmZipcodeError)
&& isSelected(selCountry, "Please make a selection!", elmCountryError)
&& isChecked("gender", "Please check a gender!", elmGenderError)
&& isChecked("color", "Please check a color!", elmColorError)
&& isLengthMinMax(txtPhone, 10, 10, "Please enter a valid phone number!", elmPhoneError)
&& isNumeric(txtPhone, "Please enter a valid phone number!", elmPhoneError)
&& isValidEmail(txtEmail, "Enter a valid email!", elmEmailError)
&& isValidPan(txtPan, "Enter a valid PAN Number!", elmPanError)
&& isValidPassword(txtPassword, "Password shall be 6-8 characters!", elmPasswordError)
&& verifyPassword(txtPassword, txtPWVerified, "Different from new password!",
elmPWVerifiedError)
}
}

function postValidate(isValid, errMsg, errElm, inputElm) {


if (!isValid) {
if (errElm !== undefined && errElm !== null && errMsg !== undefined && errMsg !== null) {
errElm.innerHTML = errMsg;
}
if (inputElm !== undefined && inputElm !== null) {
inputElm.classList.add("errorBox"); // Add class for styling
inputElm.focus();
}
}
else {
if (errElm !== undefined && errElm !== null) {
errElm.innerHTML = "";
}
if (inputElm !== undefined && inputElm !== null) {
inputElm.classList.remove("errorBox");
}
}
}

function isNotEmpty(inputElm, errMsg, errElm) {


var isValid = (inputElm.value.trim() !== "");
postValidate(isValid, errMsg, errElm, inputElm);
return isValid;
}

function isNumeric(inputElm, errMsg, errElm) {


var isValid = (inputElm.value.trim().match(/^\d+$/) !== null);
postValidate(isValid, errMsg, errElm, inputElm);
return isValid;
}

function isAlphabetic(inputElm, errMsg, errElm) {


var isValid = (inputElm.value.trim().match(/^[a-zA-Z]+$/) !== null) ;
postValidate(isValid, errMsg, errElm, inputElm);
return isValid;
}

function isAlphanumeric(inputElm, errMsg, errElm) {


var isValid = (inputElm.value.trim().match(/^[0-9a-zA-Z]+$/) !== null);
postValidate(isValid, errMsg, errElm, inputElm);
return isValid;
}

function isLengthMinMax(inputElm, minLength, maxLength, errMsg, errElm) {


var inputValue = inputElm.value.trim();
var isValid = (inputValue.length >= minLength) && (inputValue.length <= maxLength);
postValidate(isValid, errMsg, errElm, inputElm);
return isValid;
}

function isValidEmail(inputElm, errMsg, errElm) {


var isValid = (inputElm.value.trim().match(/^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/)
!== null);
postValidate(isValid, errMsg, errElm, inputElm);
return isValid;
}

function isSelected(selectElm, errMsg, errElm) {


var isValid = (selectElm.value !== "");
postValidate(isValid, errMsg, errElm, selectElm);
return isValid;
}

function isValidPan(inputElm, errMsg, errElm) {


var isValid = (inputElm.value.trim().match(/^([a-zA-Z]){5}([0-9]){4}([a-zA-Z]){1}?$/) !==
null;
postValidate(isValid, errMsg, errElm, inputElm);
return isValid;
}

function isChecked(inputName, errMsg, errElm) {


var elms = document.getElementsByName(inputName);
var isChecked = false;
for (var i = 0; i < elms.length; ++i) {
if (elms[i].checked) {
isChecked = true;
break;
}
}
postValidate(isChecked, errMsg, errElm, null);
return isChecked;
}

function isValidPassword(inputElm, errMsg, errElm) {


var isValid = (inputElm.value.trim().match(/^\w{6,8}$/) !== null);
postValidate(isValid, errMsg, errElm, inputElm);
return isValid;
}

function verifyPassword(pwElm, pwVerifiedElm, errMsg, errElm) {


var isTheSame = (pwElm.value === pwVerifiedElm.value);
postValidate(isTheSame, errMsg, errElm, pwVerifiedElm);
return isTheSame;
}

function clearForm() {
var elms = document.querySelectorAll('.errorBox');
for (var i = 0; i < elms.length; i++) {
elms[i].classList.remove("errorBox");
}

elms = document.querySelectorAll('[id$="Error"]');
for (var i = 0; i < elms.length; i++) {
elms[i].innerHTML = "";
}
document.getElementById("txtName").focus();
}

LAB-9
1. Write a PHP code to display your name, reg.no and graduation programme you are
pursuing.

<html>

<head>

<title>Sample</title>

</head>

<body>

<?php
echo '<p><h2>Name:R.MegaDharani</h2></p><br>';

echo '<p><h2>Reg No:17MIS1093</h2></p><br>';

echo '<p><h2>Graduation Programme:Mtech Integrated Software


Engineering</h2></p><br>';

?>

</body>

</html>

*OUTPUT:

2. Write a PHP code to concatenate your first name, last name and register number.

*CODE:

<html>

<head><u>Concatenation</u></head>

<br><body>

<?php

$a="Mega";

$b="Dharani";

$c="17MIS1093";

$d=$a.$b.$c;

echo "$d";

?>

</body>

</html>
*OUTPUT:

3. Write a PHP code to perform the following String Functions for the phrase “
VELLORE INSTITUTE OF TECHNOLOGY”
a. Find length of the string
b. Find the reverse of the string
c. Find the String count
d. Replace Vellore with VIT
e. Find the index of the string “OF”
f. Make use of Upper case first and Upper case word function
g. Perform String split and join function for “Techn-ology” with a hyphen
h. Print the string for 3 or 5 times

*CODE:

<html>

<head>

<title>php</title>

</head>

<body>

<?php

$a="VELLORE INSTITUTE OF TECHNOLOGY";

$b="Techn-ology";

echo strlen("VELLORE INSTITUTE OF TECHNOLOGY");

echo "<br>";

echo strrev("VELLORE INSTITUTE OF TECHNOLOGY");

echo "<br>";

echo str_word_count("VELLORE INSTITUTE OF TECHNOLOGY");

echo "<br>";

echo str_replace("VELLORE","VIT","VELLORE INSTITUTE OF TECHNOLOGY");

echo "<br>";

echo strpos("VELLORE INSTITUTE OF TECHNOLOGY","OF");

echo "<br>";
echo Strtoupper($a);

echo "<br>";

echo Ucfirst($a);

echo "<br>";

echo Str_repeat($a,5);

echo "<br>";

$c=explode('-',$b);

echo '$c';

echo "<br>";

?>

</body>

</html>

*OUTPUT:

4. Write a PHP code to perform the display your family members name with the age
and DOB along with their relationship with you in the family.

*CODE:

<html>

<head><u>Details</u><HEAD>

<br><body>

<?php

echo '<p><h2>Name:</h2>C.Radha Krishnan</p>';

echo '<p><h2>Age:</h2>44</p>';

echo '<p><h2>DOB:</h2>09-02-1975</p>';
echo '<p><h2>Relationship:</h2>Father</p><br>';

echo '<p><h2>Name:</h2>R.Maha Lakshmi</p>';

echo '<p><h2>Age:</h2>39</p>';

echo '<p><h2>DOB:</h2>17-01-1980</p>';

echo '<p><h2>Relationship:</h2>Mother</p><br>';

echo '<p><h2>Name:</h2>R.Gokul</p>';

echo '<p><h2>Age:</h2>23</p>';

echo '<p><h2>DOB:</h2>23-10-1996</p>';

echo '<p><h2>Relationship:</h2>Brother</p><br>';

?>

</body>

</html>

*OUTPUT:

LAB-10
1. VIT University has organized campus recruitment from Google. After the interview,
only 10 students got placed in Google. Write a PhP program to check whether a
particular register number is in the placed list or not.

CODE:

HTML:
<!DOCTYPE html>
<html>
<body>
<form action=a.php method="post">
<label>Enter Register number :</label>
<input type="text" name="regno">
<input type="submit" name="submit">
</form>
</body>
</html>

PHP:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<?php
$l=array("17MIS1001","17MIS1035","17MIS1040","17MIS1015","17MIS1019","17MI
S1022","17MIS1044","17MIS1048","17MIS1093","17MIS1104");
$j=0;
for($i=0;$i<10;$i++)
{
if($l[$i]==$_POST["regno"])
{
echo "Student is in placement list";
$j=1;
}
}
if($j==0)
{
echo "Student is not in the placement list";
}
?>
</body>
</html>

OUTPUT:
2. Assume that you are appointed as Data Analytics Engineer for a hospital. Ages for 8
patients are given below.

3. P- 4. Name 5. Age
Id
6. 1 7. Alen 8. 39
9. 2 10. Deena 11. 47
12. 3 13. Divya 14. 21
15. 4 16. Jack 17. 54
18. 5 19. Joe 20. 23
21. 6 22. Kelvin 23. 61
24. 7 25. Leo 26. 27
27. 8 28. Rex 29. 49

Write a PHP program to sort the data in descending order according to the
patient’s age and display the same.

CODE:
<!DOCTYPE html>
<html>
<body>
<?php
$pid=array(1,2,3,4,5,6,7,8);
$name=array("Alen","Deena","Divya","Jack","Joe","Kelvin","Leo","Rex");
$age=array(39,47,21,54,23,61,27,49);
for($i=0;$i<8;$i++)
{
for($j=0;$j<8;$j++)
{
if($age[$i]<$age[$j])
{
$temp=$age[$i];
$age[$i]=$age[$j];
$age[$j]=$temp;
$temp1=$pid[$i];
$pid[$i]=$pid[$j];
$pid[$j]=$temp1;

$temp2=$name[$i];
$name[$i]=$name[$j];
$name[$j]=$temp2;
}
}
}
for($i=0;$i<8;$i++)
{
echo $pid[$i]," ",$name[$i]," ",$age[$i],"</br>";
}
?>
</body>
</html>
OUTPUT:
3. Assume that ten students are appearing for the Dream Company Interview at VIT.
Interview has 3 rounds viz., logical, technical and interview. Marks will be awarded
for each round. The student will go to the next round if he/she gets 75%. The
student gets the maximum marks will be given the job. Write a PHP code to help the
employer to do the above task.
CODE:
HTML:
<html>
<head>
<title>SAMPLE</title>
</head>
<body>
<form action="a.php" method="post"><label>Enter the marks obtained :</label>
<input type="number" name="per">
<input type="submit" name="submit">
</form>
</body>
</html>

PHP:
<!DOCTYPE html>
<html>
<head>
<title>SAMPLE</title>
</head>
<body>
<?php
if($_POST["per"]>=75)
{
echo "The student is selected for the next level";
}
else
{
echo "The student is not selected for the next level";
}
?>
</body>
</html>

OUTPUT:
4. Write a PHP script to insert two new items “Hello” and “your name” in the
following array in any position. Original array : Frank, Leni, Joice , Louis

Use function for implementing

i. the above

ii. Count and return a total number of characters in a array

iii. From the above function, call another function to extract and display the first letter
of the array elements

iv. Print the information in sorted order and reverse order

v. Write the information into the file

vi. Retrieve and display the file information

CODE:
<!DOCTYPE html>
<html>
<head>
<title>php</title>
</head>
<body>
<?php
$l=array("Frank","Leni","Joice","Louis");
echo "Initial array : ";
print_r($l);
echo "</br>";
array_push($l,"Hello");
echo "After adding hello to array : ";
print_r($l);
echo "</br>";
array_push($l, "Megadharani");
echo "After adding name to array : ";
print_r($l);
echo "</br>";
echo "Size of array : ",count($l),"</br>";
echo "The first element of array : ",$l[0],"</br>"; sort($l);
echo "Array after sort : ";
print_r($l);
echo "</br>";
echo "Array after reverse sort : ";
rsort($l);
print_r($l);
echo "</br>";
$myfile=fopen("p1.txt","w");
for($i=0;$i<count($l);$i++)
{
fwrite($myfile,$l[$i]);
}
fclose($myfile);
$myfile1=fopen("p1.txt","r");
echo "The data in file : ",fread($myfile1,filesize("p1.txt"));
fclose($myfile1);
echo "</br>";
?>
</body>
</html>
OUTPUT:
5. Design an order form as below and implement a PhP program to pass and print the
entries to another page. Also add a ‘File Submit’ button and add 5 entries into the
file.

CODE:

HTML:
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<h2>My Book Store</h2>
<h3>Orders Form</h3>
<form action="a.php" method="post">
<h4>Name of the book &nbsp &nbsp Quantity</h4><label>Book on php</label>
&nbsp<input type="number" name="t1"></br><label>Book on Mysql</label>
<input type="number" name="t2"></br>
<label>Book on ASP</label>
<input type="number" name="t3"></br><label>Book on Web
Development</label>&nbsp<input type="number" name="t4"></br><label>Book on
Ajax</label>
&nbsp &nbsp<input type="number" name="t5"></br><h4>Personal
information</h4><label>Your Name</label>
<input type="text" name="t6"></br>
<label>Shipping Address</label>
<input type="text" name="t7"></br>
<input type="submit" name="submit">
</form>
</body>
</html>

PHP:
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<?php
$myfile=fopen("p2.txt","w");
fwrite($myfile,$_POST["t1"]);
fwrite($myfile,$_POST["t2"]);
fwrite($myfile,$_POST["t3"]);
fwrite($myfile,$_POST["t4"]);
fwrite($myfile,$_POST["t5"]);
fwrite($myfile,$_POST["t6"]);
fwrite($myfile,$_POST["t7"]);
fclose($myfile);
echo "The number of php books :",$_POST["t1"],"</br>"; echo "The number of Mysql
books :",$_POST["t2"],"</br>"; echo "The number of ASP books
:",$_POST["t3"],"</br>";
echo "The number of Web Development books :",$_POST["t4"],"</br>"; echo "The
number of Ajax books :",$_POST["t5"],"</br>"; echo "Name :",$_POST["t6"],"</br>";
echo "Shipping Address :",$_POST["t7"],"</br>";
?>
</body>
</html>
LAB-11

1. Write a PHP program to find the majority element of the given array

Code:

<html>
<head>
<title> Hello </title>
</head>

<body>
<?php
function major_ele($arr)
{
$id = 0;
$c = 1;

for($i=1; $i<sizeof($arr); $i++)


{
if ($arr[$id] == $arr[$i])
{
$c += 1;
}
else
{
$c -= 1;
if ($c == 0)
{
$id = $i;
$c = 1;
}
}
}
return $arr[$id];
}
$num1 = array(1, 2, 3, 4, 5, 5, 5, 5, 5, 5, 6);
$num2 = array(1,2,3,3,3,3,2,3,5,3,1,3,3,4,6,1,3,3,4,6,6);
print_r(major_ele($num1)."\n");
print_r(major_ele($num2)."\n");
?>
</body>

</html>

Output:
2. Write a PHP program to compute the sum of the two reversed numbers and display the
sum in reversed form in the file “numbers.php”

Code:

<html>
<head>
<title> Hello </title>
</head>

<body>
<?php
function rev_sum($n1, $n2)
{
return rev_int($n1) + rev_int($n2);
}

function rev_int($n)
{
$rev = 0;
while ($n > 0)
{
$rev = $rev * 10;
$rev = $rev + $n % 10;
$n = (int)($n/10);
}
return $rev;
}
print_r(rev_sum(13, 14)."\n");
print_r(rev_sum(130, 1)."\n");
print_r(rev_sum(305, 794)."\n");
?>
</body>

</html>
Output:

3. Write a PHP program to identify the email addresses which are not unique.

Code:

<html>
<head>
<title> Hello </title>
</head>

<body>
<?php
function array_not_unique($my_array) {
$same = array();
natcasesort($my_array);
reset ($my_array);

$old_key = NULL;
$old_value = NULL;
foreach ($my_array as $key => $value) {
if ($value === NULL) { continue; }
if ($old_value == $value) {
$same[$old_key] = $old_value;
$same[$key] = $value;
}
$old_value = $value;
$old_key = $key;
}
return $same;
}

$test_array = array();
$test_array[1] = '[email protected]';
$test_array[2] = '[email protected]';
$test_array[3] = '[email protected]';
$test_array[4] = '[email protected]';

print_r(array_not_unique($test_array));
?>
</body>

</html>

Output:

4. 4. Write a PHP program to send mail to your friends (many users) to inform about
the project work allocation and the individual student roles and responsibilities.

Code:

<html>
<head>
<title> Hello </title>
</head>

<body>
<?php
$emaillist=array("[email protected]",
"[email protected]",
"[email protected]",

"[email protected]");

$headers = "From: <[email protected]>rn".


"Reply-To:
[email protected]";
$subject =" project location and student roles";
$body=" cb's location is vada chennai role- Anbu.... ganesh's
location is vada chennai
role- Rajan";

foreach($emaillist AS $to){
$success=mail($to,$subject,$body,$headers);

if(!$success) {
echo "Mail to ". $to . " is Fail.";
}
}
?>
</body>

</html>

Output:

Mail to [email protected] is Fail.


5.

cv.php

<html>
<?php
$myfile = fopen("cv.txt", "w") or die("Unable to open file!");
$txt = "Name : Ganesh Kumar B
Age : 19
Sex : Male
Address : Thottathikudiyil, Mudavoor P.O, Muvattupuzha, Kerala
Phone No : 9488951650
Email ID : [email protected]
Degree : M.Tech SE
Strengths :
- Eye for design
- Quick learner
- Team Player

Technical Skills :
- HTML
- CSS
- PHP
- C++
- Python
- Java
- Javascript

Profile :
An enthusiastic learner, who can quickly grasp concepts when required to do so.
Gels well with other people, and is often the glue that holds a group together.
A great sense of empathy, and an ability to smooth things over between people make for
an excellent diplomat.
";
fwrite($myfile, $txt);
fclose($myfile);
?>
</html>

cv.html

<!DOCTYPE html>

<html>
<body>
<form action="upload.php" method="post" enctype="multipart/form-data">
<fieldset>

<legend align="top">Upload Form</legend>

Select CV File to Upload : <input type="file"


name="UploadFile">
<br>
<input type="submit" value="Upload CV"
name="Submit">
</fieldset>
</form>
</body>
</html>

hulo.php

<html>
<?php
if ($_FILES["UploadFile"]["error"] > 0)
{ echo "Error: " . $_FILES["UploadFile"]["error"] . "<br />"; }
elseif ($_FILES["UploadFile"]["type"] !== "text/plain")
{ echo "File must be a .txt"; }
else
{ echo "Successful upload!"; }
?>
</html>

Output:
LAB-12

1. Create login page with login and password with submit button

Form.html

<!DOCTYPE html>

<html>

<head>

<title> Web Form </title>

</head>

<body>
<center>

<h1> <b> LOGIN IN !</b></h1>

<form action="a.php" method="post">

<label> Username : <input type="text" name="uname"></label> <br> <br>

<label> Password : <input type="password" name="pass"></label> <br> <br>

<input type="submit" name="submit" value="login">

</form>

</center>

</body>

</html>

a.php

<?php
$servername = "127.0.0.1";
$username = "root";
$password = "";
$dbname = "studentdb";

$con= mysqli_connect($servername,$username,$password);

if(!$con)
{
echo 'Not connected to the server';
}

if(!mysqli_select_db($con,'studentdb'))
{
echo 'database not selected';
}

$username = $_POST['uname'];
$password = $_POST['pass'];

$sql ="INSERT INTO acadet (username,password) VALUES ('$username','$password')";

if(!mysqli_query($con,$sql))
{
echo 'Not inserted';
}
else
{
echo 'Inserted';
}

header("refresh:2; url=form.html");
?>

2. Create form registration and user data will be stored in the MySQL database, use create,
insert, select,update commands

CODE:

Form.html
<!DOCTYPE html>
<html>
<head>
<title> Web Form </title>
</head>
<body>
<center>
<h1> <b> EMPLOYEE VACATION TOUR </b></h1>
<h3> <i> Register here</i></h3><br>
<form action="b.php" method="post">
<label> Name : <input type="text" name="name"></label> <br> <br>
<label> E-ID : <input type="text" name="empid"></label> <br> <br>
<label> Email : <input type="text" name="email"></label> <br> <br>
<label> Ph.no : <input type="text" name="phno"></label> <br> <br>
<input type="submit" name="submit" value="Register"> <br> <br>
<label> do you wanna update? then, <a href="update.html"> Update </a> </label>
</form>
</center>
</body>
</html>

Update.html
<!DOCTYPE html>
<html>
<head>
<title> update </title>
</head>
<body>
<center>
<form action="a.php" method="post">
<label> enter your E_ID : <input type="text" name="eid"></label> <br> <br>
<h2> <b> Enter the details to be updated </b></h2>
<label> Name : <input type="text" name="uname"></label> <br> <br>
<label> Email : <input type="text" name="uemail"></label> <br> <br>
<label> Ph.no : <input type="text" name="uphno"></label> <br> <br>
<input type="submit" name="submit" value="update"> <br> <br>
</form>
</center>
</body>
</html>

b.php
<?php
$servername = "127.0.0.1";
$username = "root";
$password = "";
$dbname = "studentdb";

$con= mysqli_connect($servername,$username,$password);

if(!$con)
{
echo 'Not connected to the server';
}

if(!mysqli_select_db($con,'studentdb'))
{
echo 'database not selected';
}

$name = $_POST['name'];
$empid = $_POST['empid'];
$email = $_POST['email'];
$phno = $_POST['phno'];

$inssql ="INSERT INTO empdetails (name,empid,email,phno) VALUES


('$name','$empid','$email','$phno')";

if(!mysqli_query($con,$inssql))
{
echo 'Not inserted';
}
else
{
echo 'Inserted ';
}

header("refresh:2; url=form.html");
?>

a.php

<?php
$servername = "127.0.0.1";
$username = "root";
$password = "";
$dbname = "studentdb";

$con= mysqli_connect($servername,$username,$password);

if(!$con)
{
echo 'Not connected to the server';
}

if(!mysqli_select_db($con,'studentdb'))
{
echo 'database not selected';
}

$uname = $_POST['uname'];
$uemail = $_POST['uemail'];
$uphno = $_POST['uphno'];
$eid = $_POST['eid'];

$upsql="UPDATE empdetails set name='$uname' , empid='$eid' , email='$uemail' ,


phno='$uphno' WHERE empid='$empid' ";

if(!mysqli_query($con,$upsql))
{
echo 'Not updated... pls wait';
}
else
{
echo 'yes... updated';
}

?>

OUTPUT:

You might also like