WOT Practicle File: Manjotpal Singh UE188058 4 SEM It Section-1 (Gp-3)

WOT
PRACTICLE FILE
_________________________________________________________________________________________________________________________
MANJOTPAL SINGH
UE188058
4th SEM
IT SECTION-1 (GP-3)
Objective : To study table tag and its attributes in HTML
<!DOCTYPE html>
<head>
<title>WOT</title>
</head>
<body>
<caption>Lab time table</caption>
<table border="2px" cellspacing="0px" cellpadding="20px">
<tr>
<th></th>
<th>9-10</th>
<th>10-11</th>
<th>11-12</th>
<th>12-1</th>
<th>2-3</th>
<th>3-4</th>
<th>4-5</th>
</tr>
<tr>
<th>MON</th>
<td colspan="3">WOT-1</td>
<td></td>
</tr>
<tr>
<th>TUE</th>
<td></td>
</tr>
<tr>
<th>WED</th>
<td colspan="3"></td>
<td></td>
</tr>
</table>
</body>
</html>
Objective : Use frameset and iframe in an HTML document.
(i) Using frameset

<!DOCTYPE html>
<frameset cols="*, *, 40%">
<frame src="wot1.html">
</frameset>
</html>
(ii) Using iframe
<html>
<iframe src="wot1.html" ></iframe>
<iframe src="wot2.html"height="300px"
width="600px"></iframe>
<iframe src="wot3.html"></iframe>
</html>
Objective : To study HTML form element and its methods and

attributes.
<!DOCTYPE html>
<head>
<title>Registration form</title>
</head>
<body>
<form>
First name : <input type="text" name="first_name"/><br><br>
Last name : <input type="text" name="last_name"/><br><br>
Email Id : <input type="text" name="email_id"/><br><br>
Phone number : <input type="text"

name="phone_number"/><br><br>
Gender : <select name="dropdown">
<option value="None" selected>None</option>
<option value="Male">Male</option>
<option value="Female">Female</option>
<option value="Transgender">Transgender</option></select>
<br><br>
Senior seconday Education : <select name="dropdown">
<option value="None" selected>None</option>
<option value="Medical">Medical</option>
<option value="Non-Medical">Non-Medical</option></select>
<br><br>
Photograph:<input type="file" name="fileupload"
accept="image/*"/><br><br>
Signature:<input type="file" name="fileupload"

accept="image/*"/><br><br>
<br>
<center>
<input type="Submit" name="Submit" value="Submit"/>
<input type="Reset" name="Reset" value="Reset"/>
<input type="button" name="Ok" value="Ok"/>
</center>
</form>
</body>
</html>
Objective : To study alert dialog boxes in JavaScript.
<!DOCTYPE html>
<head> <title>alert</title></head>
<body>
<script type="text/javascript">
alert("To go ahead click ok")
var a=confirm("you will be directed to yahoo")
if(a==true)
document.write("yahoo.com")
else
document.write("end")
}
</script>
</body>
</html>
Objective : To study prompt dialog boxes in javaScript.
<!DOCTYPE html>
<html lang="en">
<head>
<meta Charsret="UTF-8">
<title>JS</title>
</head>
<body>
<p class="first">Nothing is common</p>

<script>
prompt("Enter");
</script>
</body>
</html>
Objective : Introduction about style sheets and its types along with
implementation.
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Manjotpal</title>
<link rel="stylesheet" type="text/css"
href="css/styleassignment.css">
</head>
<body>
<header>
<h1>Manjotpal Singh</h1>
<nav>
<a href="#One" aria-label="Nothing">One</a>
<a href="#Two" aria-label="Nothing">TWO</a>
<a href="#Three" aria-label="Nothing">Three</a>
<a href="#MORE" aria-label="Nothing">MORE</a>
</nav>
</header>
<section class="half">
<h2>Favourite Foods</h2>
<ul>
<li>Apple</li>
<li>Chocolate</li>
<li>Fish</li>
<li>Pizza</li>
</ul>
</section>
<section class="half">
<h2>Achievements</h2>
<p>
Progress in this course (100%) <progress

value="1"></progress><br>
Progress in the Specialization capstone (20%)

<progress value="20" max="100"></progress><br>
Progress in Life goals (70%) <progress value="70"

max="100"></progress>
</p>
</section>
<section class="new">
<h2>More About Me</h2>
<details>
<summary>My Childhood</summary>
I grew up in Amritsar. I really miss those

days.My chidhood was fun.
</details>
</section>
<footer>
<p>
<img src=" http://www.intro-
webdesign.com/images/newlogo.png" alt="Logo"/>
This page was created by Manjotpal Singh. To learn

more about web design, visit <a href=" http://www.intro-
webdesign.com" aria-label="Intro to webdesign">Intro To
Webdesign.</a> </p>
</footer>
</body>
</html>
CSS
body{
background-color: #03A9F4;
margin: 2%;
font-size: 150%;
header{
background-color: #B3B3B3;
h1{
text-align: center;
font-size: 250%;
color: #424242;
}
nav{
text-align: center;
text-transform: uppercase;
font-family: "Arial";
font-size: 120%;
padding-bottom: 1%;
h2{
color: #424242;
background: #B3B3B3;
font-size: 150%;
summary{
font-style: normal;
color:#000000;
details{
font-style: oblique;
color: red;
}
footer{
background-color: #B3B3B3;
height: 100px;
clear: both;
.half{
width: 45%;
display: inline-block;
margin-right: 2%;
float: left;
img{
width: 75px;
nav a{
display: inline-block;
background-color: #FFFFFF;
color:#5e35b1;
width: 23%;
.new{
clear: both;
header, footer{
background: linear-gradient(#666666 0%, #00b7ea 100%);
Objective: To study and implementation of cookies in JavaScript.
<!DOCTYPE html>
<html>
<head>
<script type = "text/javascript">

</script>
</head>
<body>
<form name = "myform" action = "">
Enter name: <input type = "text" name = "customer"/>
<input type = "button" value = "Set Cookie" onclick =

"WriteCookie();"/>
</form>
</body>
</html>
Objective: Building of webforms using HTML elements, Javascript

and CSS.
HTML AND CSS
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Shipping and Billing</title>
<style>
input{
border:1px solid black;
input:focus{
background-color: #E6E6E6;
fieldset{
margin-bottom: 4%;
</style>
<script src="JS/billing.js"></script>
</head>
<body>
<h1>JavaScript Homework</h1>
<form>
<fieldset>
<legend>Shipping Information</legend>
<label for ="shippingName">Name:</label>
<input type = "text" name = "Name" id = "shippingName"

required><br/>
<label for = "shippingzip">Zip code:</label>
<input type = "text" name = "zip" id = "shippingZip" pattern = "[0-

9]{5}" required><br/>
</fieldset>
<input type="checkbox" id="same" name="same" onchange=

"billingFunction()"/>
<label for = "same">Is the Billing Information the

Same?</label> <fieldset>
<legend>Billing Information</legend>
<label for ="billingName">Name:</label>
<input type = "text" name = "Name" id = "billingName"

required><br/>
<label for = "billingzip">Zip code:</label>
<input type = "text" name = "zip" id = "billingZip" pattern = "[0-

9]{5}" required><br/>
</fieldset>
<input type = "submit" value = "Verify"/>
</form>
</body>
</html>
JavaScript
function billingFunction(){
if(document.getElementById('same').checked){
document.getElementById('billingName').value=document.getEl
ementById('shippingName').value;
document.getElementById('billingZip').value=document.getElem
entById('shippingZip').value;
else{
document.getElementById('billingName').value="";
document.getElementById('billingZip').value="";
}
Objective: To study loops in PHP.
While Loop
<?php
$max = 0;
echo $i = 0;
echo ",";
echo $j = 1;
echo ",";
$result=0;
while ($max < 10 )
$result = $i + $j;
$i = $j;
$j = $result;
$max = $max + 1;
echo $result;
echo ",";
?>
Do-While Loop
<?php
$handle = fopen("file.txt", "r");
if ($handle)
do
$line = fgets($handle);
} while($line !== false);
fclose($handle);
?>
For Loop
<?php
for ($i=1; $i<=10; ++$i)
echo sprintf("The square of %d is %d.</br>", $i, $i*$i);

}
?>
For Each
<?php
$fruits = array('apple', 'banana', 'orange', 'grapes');
foreach ($fruits as $fruit)
echo $fruit;
echo "<br/>";
$employee = array('name' => 'John Smith', 'age' => 30, 'profession'

=> 'Software Engineer');
foreach ($employee as $key => $value)
echo sprintf("%s: %s</br>", $key, $value);
echo "<br/>";
?>
Objective: To study various control structures in PHP
If
<?php
$age = 50;
if ($age > 30)
echo "Your age is greater than 30!";
?>
Else
<?php
$age = 50;
if ($age < 30)
echo "Your age is less than 30!";
else
echo "Your age is greater than or equal 30!";
?>
Else If
<?php
$age = 50;
if ($age < 30)
echo "Your age is less than 30!";
elseif ($age > 30 && $age < 40)
echo "Your age is between 30 and 40!";
elseif ($age > 40 && $age < 50)
echo "Your age is between 40 and 50!";
else
echo "Your age is greater than 50!";
?>
Switch
<?php
$favourite_site = 'Code';
switch ($favourite_site) {
case 'Business':
echo "My favourite site is business.tutsplus.com!";
break;
case 'Code':
echo "My favourite site is code.tutsplus.com!";
break;
case 'Web Design':
echo "My favourite site is webdesign.tutsplus.com!";
break;
case 'Music':
echo "My favourite site is music.tutsplus.com!";
break;
case 'Photography':
echo "My favourite site is photography.tutsplus.com!";
break;
default:
echo "I like everything at tutsplus.com!";
?>
Objective: To study arrays in PHP.
<html>
<body>
<?php
/* First method to create array. */
$numbers = array( 1, 2, 3, 4, 5);
foreach( $numbers as $value ) {
echo "Value is $value <br />";
/* Second method to create array. */
$numbers[0] = "one";
$numbers[1] = "two";
$numbers[2] = "three";
$numbers[3] = "four";
$numbers[4] = "five";
foreach( $numbers as $value ) {
echo "Value is $value <br />";
?>
</body>
</html>
Objective: To study array sorting in PHP.
Sorting Indexed Arrays in Ascending Order
<!DOCTYPE html>
<html lang="en">
<head>
<title>Sorting PHP Indexed Array in Ascending Order</title>
</head>
<body>
<?php
// Define array
$colors = array("Red", "Green", "Blue", "Yellow");
// Sorting and printing array
sort($colors);
print_r($colors);
?>
</body>
</html>
Sorting Indexed Arrays in Descending Order
<!DOCTYPE html>
<html lang="en">
<head>
<title>Sorting PHP Indexed Array in Descending Order</title>
</head>
<body>
<?php
// Define array
$numbers = array(1, 2, 2.5, 4, 7, 10);
// Sorting and printing array
rsort($numbers);
print_r($numbers);
?>
</body>
</html>
Sorting Associative Arrays in Ascending Order By Value
<!DOCTYPE html>
<html lang="en">
<head>
<title>Sorting PHP Associative Array in Ascending Order by

Value</title>
</head>
<body>
<?php
// Define array
$age = array("Peter"=>20, "Harry"=>14, "John"=>45, "Clark"=>35);
// Sorting array by value and print
asort($age);
print_r($age);
?>
</body>
</html>
Sorting Associative Arrays in Descending Order By Value
<!DOCTYPE html>
<html lang="en">
<head>
<title>Sorting PHP Associative Array in Descending Order by

Value</title>
</head>
<body>
<?php
// Define array

arsort($age);
print_r($age);
?>
</body>
</html>
Sorting Associative Arrays in Ascending Order By Key
<!DOCTYPE html>
<html lang="en">
<head>
<title>Sorting PHP Associative Array in Ascending Order by

Key</title>
</head>
<body>
<?php
// Define array
ksort($age);
print_r($age);
?>
</body>
</html>
Sorting Associative Arrays in Descending Order By Key
<!DOCTYPE html>
<html lang="en">
<head>
<title>Sorting PHP Associative Array in Descending Order by

Key</title>
</head>
<body>
<?php
// Define array
krsort($age);
print_r($age);
?>
</body>
</html>
Objective: To study working of cookies in PHP.

<!DOCTYPE html>
<?php
$cookie_name = "user";
$cookie_value = "Manjot";
setcookie($cookie_name, $cookie_value, time() +
(86400 * 30), "/"); // 86400 = 1 day
?>
<html>
<body>
<?php
if(!isset($_COOKIE[$cookie_name])) {
echo "Cookie named '" . $cookie_name . "' is not set!";
} else {
echo "Cookie '" . $cookie_name . "' is set!<br>";
echo "Value is: " . $_COOKIE[$cookie_name];
}
?>
<p><strong>Note:</strong> You might have to reload the page to
see the value of the cookie.</p>
</body>
</html>
output
Objective: To study file handling in PHP.
Reading a file
<html>
<head>
<title>Reading a file using PHP</title>
</head>
<body>
<?php
$filename = "tmp.txt";
$file = fopen( $filename, "r" );
if( $file == false ) {
echo ( "Error in opening file" );
exit();
$filesize = filesize( $filename );
$filetext = fread( $file, $filesize );
fclose( $file );
echo ( "File size : $filesize bytes" );
echo ( "<pre>$filetext</pre>" );
?>
</body>
</html>
Writing a file
<?php
$filename = "/home/user/guest/newfile.txt";
$file = fopen( $filename, "w" );
echo ( "Error in opening new file" );
exit();
fwrite( $file, "This is a simple test\n" );
fclose( $file );
?>
<html>
<head>
<title>Writing a file using PHP</title>
</head>
<body>
<?php
$filename = "newfile.txt";
$file = fopen( $filename, "r" );
echo ( "Error in opening file" );
exit();
$filesize = filesize( $filename );
$filetext = fread( $file, $filesize );
fclose( $file );
echo ( "File size : $filesize bytes" );
echo ( "$filetext" );
echo("file name: $filename");
?>
</body>
</html>

WOT Practicle File: Manjotpal Singh UE188058 4 SEM It Section-1 (Gp-3)

Uploaded by

Copyright:

Available Formats

WOT Practicle File: Manjotpal Singh UE188058 4 SEM It Section-1 (Gp-3)

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

WOT Practicle File: Manjotpal Singh UE188058 4 SEM It Section-1 (Gp-3)

Uploaded by

Copyright:

Available Formats

WOT

<caption>Lab time table</caption>

<table border="2px" cellspacing="0px" cellpadding="20px">

(i) Using frameset

Objective : To study HTML form element and its methods and

First name : <input type="text" name="first_name"/><br><br>

Last name : <input type="text" name="last_name"/><br><br>

Email Id : <input type="text" name="email_id"/><br><br>

Phone number : <input type="text"

Gender : <select name="dropdown">

<option value="None" selected>None</option>

Senior seconday Education : <select name="dropdown">

<option value="None" selected>None</option>

Signature:<input type="file" name="fileupload"

<input type="Submit" name="Submit" value="Submit"/>

<input type="Reset" name="Reset" value="Reset"/>

<input type="button" name="Ok" value="Ok"/>

Objective : To study alert dialog boxes in JavaScript.

alert("To go ahead click ok")

var a=confirm("you will be directed to yahoo")

<p class="first">Nothing is common</p>

<a href="#One" aria-label="Nothing">One</a>

<a href="#Two" aria-label="Nothing">TWO</a>

<a href="#Three" aria-label="Nothing">Three</a>

<a href="#MORE" aria-label="Nothing">MORE</a>

Progress in this course (100%) <progress

Progress in the Specialization capstone (20%)

Progress in Life goals (70%) <progress value="70"

<h2>More About Me</h2>

I grew up in Amritsar. I really miss those

This page was created by Manjotpal Singh. To learn

background: linear-gradient(#666666 0%, #00b7ea 100%);

Objective: To study and implementation of cookies in JavaScript.

<script type = "text/javascript">

if( document.myform.customer.value == "" ) {

alert("Enter some value!");

document.cookie = "name=" + cookievalue;

document.write ("Setting Cookies : " + "name=" +

<form name = "myform" action = "">

Enter name: <input type = "text" name = "customer"/>

<input type = "button" value = "Set Cookie" onclick =

Objective: Building of webforms using HTML elements, Javascript

HTML AND CSS

<title>Shipping and Billing</title>

border:1px solid black;

<input type = "text" name = "Name" id = "shippingName"

<label for = "shippingzip">Zip code:</label>

<input type = "text" name = "zip" id = "shippingZip" pattern = "[0-

<input type="checkbox" id="same" name="same" onchange=

<label for = "same">Is the Billing Information the

<label for ="billingName">Name:</label>

<input type = "text" name = "Name" id = "billingName"

<label for = "billingzip">Zip code:</label>

<input type = "text" name = "zip" id = "billingZip" pattern = "[0-

<input type = "submit" value = "Verify"/>

while ($max < 10 )

$handle = fopen("file.txt", "r");

} while($line !== false);

for ($i=1; $i<=10; ++$i)