PHP Record

Shrimathi Devkunvar Nanalal Bhatt Vaishnav College for Women,
(Autonomous)
Re-Accredited with ‘A+’ Grade By NAAC.
Chromepet, Chennai-44.
M.Sc. (COMPUTER SCIENCE)
(First Year- I Semester)
2022-2023
ADVANCED WEB DESIGNING LAB
NAME : ...........................................
REG NO : ...........................................
SUB CODE : ...........................................
CERTIFIED GENUINE RECORD OF WORK DONE BY.............................
LECTURER INCHARGE HEAD OF THE DEPARTMENT
Submitted for M.Sc Practical Examination held on

________________________________ at Shrimathi Devkunvar Nanalal Bhatt Vaishnav
College for Women (Autonomous), Chennai-44.
EXAMINERS
1. 2
INDEX
PG. SIGNATUR
SL.NO NO E
TITLE
1
Bootstrap Grid system
Bootstrap CSS
o Typography
o Tables
o Images
2 o Forms
o Buttons
Bootstrap Layout components
o Button groups
o Navigation
3 o Dropdowns
o Pagination, Progress bars & Alerts
Bootstrap JS Plugins
o JS carousels, JS collapse , JS Tabs
4
and JS dropdown
o JS Alerts, JS Button, JS Modal, JS
Popover, JS scrollspy and JS tooltip
5
Arrays in PHP
6
Functions using PHP
7
Object Oriented Programming
8
Form Validation using PHP
Working with MySQL

9
10
Database connection
Cookies in PHP
11
13 Session in PHP
14 AJAX in PHP
EX.NO. : 1
DATE : BOOTSTRAP GRID SYSTEM
AIM:
To write a program for Bootstrap program to make use basic grid system. Try with
different column spans and apply it for several devices as responsive web page.
TAGS USED:
Grid System:
Bootstrap's grid system is built with flex box and allows up to 12 columns across the
page. The grid system is responsive, and the columns will re-arrange automatically depending
on the screen size.
Grid System has five classes:

• .col- (extra small devices - screen width less than 576px)
• col-sm- (small devices - screen width equal to or greater than 576px)
• .col-md- (medium devices - screen width equal to or greater than 768px)
• .col-lg- (large devices - screen width equal to or greater than 992px)
• .col-xl- (xlarge devices - screen width equal to or greater than 1200px.
Responsive Web Page:

It can access websites from anywhere and accessed from different devices like mobile,
PC, Notepad, etc. Even Google has considered a point of emphasizing how these responsive
websites play an important role in web design.
PROGRAM:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Bootstrap Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css">
</head>
<body>
<div class="container-fluid">
<div class=" col bg-danger text-white text-center p-4">
<h1>This is Header</h1>
</div>
<br>
<div class="row">
<div class="col-lg-6 bg-success text-center p-5"> Sub heading 1 </div>
<div class="col-lg-6 bg-warning text-center p-5"> Sub heading 2 </div>
</div>
<br>
<div class="row">
<div class="col-lg-6 bg-success text-center p-5"> Sub heading 3 </div>
<div class="col-lg-6 bg-warning text-center p-5"> Sub heading 4 </div>
</div>
<br>
<div class="row">
<div class="col-sm-3 bg-success text-center p-3"> Sub heading 1</div>
<div class="col-sm-3 bg-warning text-center p-3"> Sub heading 2</div>
<div class="col-sm-3 bg-success text-center p-3"> Sub heading 3</div>
<div class="col-sm-3 bg-warning text-center p-3"> Sub heading 4</div>
</div>
<br>
<div class=" col bg-dark text-white text-center p-4">
<h1>Page Footer</h1>
</div>
</div>
</body>
</html>
Output :
EX.NO. : 2
DATE : BOOTSTRAP CSS
AIM:
Write a Bootstrap program to implement.
• Images
• Button
• Forms
• Tables
TAGS USED:
• <img> - used to embed an image in an HTML page.
• <form></form> - container for different types of input elements, such as: text fields,
checkboxes,radio buttons, submit buttons, etc. Used to collect user input.
• <input> - specifies an input field where the user can enter data.
• <label></label> - represents a caption for an item in a user interface.
• <button><//button> - defines a clickable button.
• <table></table> - consists of table cells inside rows and columns.
• <tr></tr>- defines a row in an HTML table.
• <td></td> - defines a standard data cell in an HTML table.
• <tb></tb>- used to group the body content in an HTML table.
• <tbody></tbody>-used to group the body content in an HTML table.
• <thead></thead>-used to group the head content in an HTML table.
CLASSES USED:
• .img-rounded-used to adds rounded corners to an image.
• .form-control - Used on input, textarea, and select elements to span the entire width of
the
• page and make them responsive.
• .form-group - Container for form input and label.
• .form-check-label, .form-check-input, .form-check – used to place checkboxes.
• .btn - Adds basic styling to any button.
• .table-striped used to adds zebra-stripes to a table
• .table-hover class adds a hover effect (grey background color) on table rows.
PROGRAM:
<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.slim.min.js"></script>
<script
src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js"></script>
<script
src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"></script>
</head>
<body>
<div class="container">
<div class="col-lg-4 col-md-6 mb-4">
<h3>IMAGES</h3>
<img src="https://img.etimg.com/thumb/msid-75477453,width-640,height-480,imgsize-
52514,overlay-ettech/photo.jpg" class="rounded-circle img-fluid mb-4" alt="">
<h2>Form</h2>
<form action="/action_page.php">
<div class="form-group">
<label for="email">Email:</label>
<input type="email" class="form-control" id="email" placeholder="Enter email"
name="email">
</div>
<label for="pwd">Password:</label>
<input type="password" class="form-control" id="pwd" placeholder="Enter password"
name="pswd">
</div>
<div class="form-group form-check">
<label class="form-check-label">
<input class="form-check-input" type="checkbox" name="remember"> Remember me
</label>
</div>
<button type="submit" class="btn btn-primary">Submit</button>
</form>
</div>
<h2>Table </h2>
<table class="table table-dark table-striped table-hover">
<thead>
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Roll Number</th>
<th>Department Name</th>
<th>Email</th>
</tr>
</thead>
<tbody>
<tr>
<td>John</td>
<td>Doe</td>
<td>01</td>
<td>Msc.cs</td>
<td>[email protected]</td>
</tr>
<tr class="table-primary">
<td>July</td>
<td>Dooley</td>
<td>04</td>
<td>Msc.cs</td>
<td>[email protected]</td>
</tr>
</tbody>
</table>
</body>
</html>
OUTPUT:
EX.NO. : 3 BOOTSTRAP LAYOUT
DATE :
COMPONENTS
AIM:
To Write a program for Bootstrap Layout Components.
CLASSES USED:
• NAV : To make the tabs toggleable, add the data-toggle=”pill”
• BUTTON GROUP : Use a <div> element with class .btn-group to create a button
group
• ALERT : Alerts are created with the .alert class.
• PAGINATION : To create a basic pagination, add the .pagination class to an <ul>
element.
• PROGRESS BAR : To create a default progress bar, add a .progress class to a
container element.
• DROPDOWN : The .dropdown class indicates a dropdown menu.
PROGRAM:
<!DOCTYPE html>
<html lang="en">
<head>
<script
<script
</head>
<body>
<h2>Bootstrap layout components</h2>
<ul class="nav nav-pills"role="tablist">
<li class="nav-item">
<a class="nav-link active" data-toggle="pill"href="#br">BG AND ALERTS</a>
</li>
<a class="nav-link"data-toggle="pill" href="#page">PAGINATION AND PROGRESS
BAR</a>
</li>
<li class="nav-item dropdown">
<button type="button"class="btn btn-primary dropdown-toggle" data toggle =
"dropdown"> Dropdown </button>
<div class="dropdown-menu">
<a class="dropdown-item" href="#">read more</a>
<a class="dropdown-item" href="#">learn more</a>
<a class="dropdown-item" href="#">book now</a></div>
</li>
</ul>
</div>
<div class="tab-content">
<div id="br" class="container tab-pane active"><br>
<h2>button group</h2>
<div class="btn-group">
<button type="button" class="btn btn-primary">buy now</button>
<button type="button" class="btn btn-primary">download now</button>
<button type="button" class="btn btn-primary">watch now</button>
</div>
<h2>Alerts</h2>
<div class="alert alert-success"> <strong>Success!</strong> it's a green alert </div>
<div class="alert alert-info"> <strong>Info!</strong> it's a light blue alert</div>
<div class="alert alert-warning"> <strong>Warning!</strong> it's a orange alert </div>
<div class="alert alert-danger"> <strong>Danger!</strong> it's a red alert </div>
<div class="alert alert-primary"> <strong>Primary!</strong> important action </div>
<div class="alert alert-secondary"> <strong>Secondary!</strong> less important action.
</div>
<div class="alert alert-dark"> <strong>Dark!</strong> Dark grey alert. </div>
</div>
<div id="page" class="container tab-pane"><br>
<h2>pagination</h2>
<ul class="pagination">
<li class="page-item"><a class="page-link" href="#">Previous</a></li>
<li class="page-item"><a class="page-link" href="#">1</a></li>
<li class="page-item"><a class="page-link" href="#">Next</a></li>
</ul>
<h2>progress bar</h2>
<div class="progress">
<div class="progress-bar" style="width:70%"></div>
</div>
</div>
</div>
</body>
</html>
OUTPUT:
EX.NO. : 4
DATE : BOOTSTRAP JS PLUGINS
AIM:
Write a Bootstrap program to implements
• JS Carousal, JS Collapse, JS Tab, JS Dropdown
• JS Alert, JS Button, JS Modal, JS Popover, JS Scrollspy, JS Tooltip
TAGS USED:
o <nav></nav> - represents a section of a page whose purpose is to provide navigation
links
o <img> - used to embed an image in an HTML page
o <ul></ul> - defines an unordered (bulleted) list
o <li></li> - defines a list item
o <a> - defines a hyperlink, which is used to link from one page to another
o <div></div> - defines a division or a section in an HTML document
o <form></form> - container for different types of input elements, such as: text fields,
checkboxes, radio buttons, submit buttons, etc. Used to collect user input.
o <input> - specifies an input field where the user can enter data
o <label></label> - represents a caption for an item in a user interface
o <button></button> - defines a clickable button
o <table></table> - consists of table cells inside rows and columns
o <tr></tr> - defines a row in an HTML table.
o <td></td> - defines a standard data cell in an HTML table
o <tbody></tbody> - used to group the body content in an HTML table
o <strong></strong> - used to define text with strong importance
o <center></center> - used in HTML4 to center-align text
o <br> - inserts a single line break
o <h4></h4> - the fourth level heading in the HTML document
CLASSES USED:
o .navbar - adjusts vertical alignment and horizontal spacing for strings of text
o .navbar-expand-* - navigation bar can extend or collapse, depending on the screen
size
o .fixed-top - position an element at the top of the viewport
o .navbar-light - This class will set the color of the text to dark. This is used when
using a light background color.
o .bg-warning - background color represent in warning
o .navbar-brand - used to highlight the brand/logo/project name of the page
o .navbar-nav – used to list the nav-items and nav-link
o .nav-item - used to create navigation menu
o .nav-link - used to create navigation menu
o .modal - add dialogs to your site for lightboxes, user notifications, or completely
custom content.
o .fade - adds a transition effect which fades the modal in and out
o .modal-dialog - improves accessibility for people using screen readers.
o .modal-content – contains header, body and footer contents.
o .modal-header - define the style for the header of the modal
o .modal-title - styles the header with a proper line-height.
o .modal-body - to define the style for the body of the modal
o .modal-footer - used to customize the default footer of a modal dialog
o .carousel - let you display text, graphics, images, and even video in one interactive,
“sliding” block
o .slide - Adds a CSS transition and animation effect when sliding from one item to
the next
o .carousel-indicator - Adds indicators for the carousel. These are the little dots at the
bottom of each slide (which indicates how many slides there are in the carousel, and
which slide the user are currently viewing)
o .carousel-inner - Adds slides to the carousel
o .carousel-item - Specifies the content of each slide
o carousel-control-prev - Adds a left (previous) button to the carousel, which allows
the user to go back between the slides
o carousel-control-prev-icon - Used together with .carousel-control-prev to create a
"previous" button
o carousel-control-next - Adds a right (next) button to the carousel, which allows the
user to go forward between the slides
o carousel-control-next-icon - Used together with .carousel-control-next to create a
"next" button
o .alert - used to provide an easy way to create predefined alert messages.
o .alert-warning – display alert message with warning background
o .alert-dismissible - adds extra padding to the right of the alert and positions the close
button
o .nav - create a simple horizontal menu
o .nav-tabs - Turn the nav menu into navigation tabs
o .tab-content – used to separate content into different panes where each pane is
viewable one at a time
o .tab-pane - adds unique ID for every tab and wrap them inside a <div> element
o .text-dark – represents darker text
o .active - used to highlight any active content from a selection, mostly in navigation
o .btn - Adds basic styling to any button
o .btn-warning - Indicates caution should be taken with this action
o .dropdown - Indicates a dropdown menu
o .dropdown-toggle - used to open the dropdown menu, use a button or a link
o .dropdown-menu - Builds the dropdown menu
o .dropdown-item – used to separate menu items
o . collapse - Indicates collapsible content - which can be hidden or shown on demand
o .form-control - Used on input, textarea, and select elements to span the entire width
of the page and make them responsive
o .form-group - Container for form input and label
o .form-check-label, .form-check-input, .form-check – used to place checkboxes
METHODS USED:
$("#myCarousel").carousel(); Activates the carousel
$(".item1").click(function() {
$("#myCarousel").carousel(0);});
Enable Carousel Indicators
$(".carousel-control-prev").click(function() {
$("#myCarousel").carousel("prev");});
Enable Carousel Controls
$(".carousel-control-next").click(function() {
$("#myCarousel").carousel("next");});
$(".close").click(function() {
Closes the alert message
$("#myAlert").alert("close");});
$("#bt").click(function() {
Activates the content as a modal
$("#myLogin").modal();});
$(".nav-tabs a").click(function() {
Select all tabs
$(this).tab('show');});
$(".dropdown-toggle").dropdown(); Toggles the dropdown
$('[data-toggle="tooltip"]').tooltip(); Activates the tooltip
$('[data-toggle="popover"]').popover(); Activates the popover
$('body').scrollspy({ Activates scrollspy, specifies the number of
target: ".navbar", pixels to offset from top when calculating
offset: 50}); the position of scroll
$("#knowmore").click(function() {
Toggles the collapsible element
$(".collapse").collapse('toggle');});
PROGRAM:
<html>
<head>
<title>BNetTimes</title>
<script
<script
</head>
<body style="background-color:#FFEFE5;">


<nav class="navbar navbar-expand-sm fixed-top bg-warning navbar-light">
<a class="navbar-brand" href="#">
<img
src="https://us.123rf.com/450wm/sergeypykhonin/sergeypykhonin1809/sergeypykhonin1809
00041/108230283-registration-register-logo-or-label-diary-note-icon-vector-
illustration.jpg?ver=6" alt="logo" style="width:40px;"> <strong>BNetTimes</strong>
</a>
<ul class="navbar-nav ml-auto">

<a class="nav-link" href="#fanta">Fantasy</a>
</li>
<a class="nav-link" href="#adv">Adventure</a>
</li>
<a class="nav-link" href="#thr">Thriller</a>
</li>
<a class="nav-link" href="#hor">Horror</a>
</li>
<a class="nav-link" href="#his">Historical</a>
</li>

<button type="button" id="bt" class="btn btn-warning" data-toggle="tooltip"
title="Click Here!">LOGIN NOW</button>
</li>

</ul>
</nav>


<div class="modal fade" id="myLogin">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">LogIn</h4>
<button type="button" class="close" data-dismiss="modal">×</button>
</div>
<div class="modal-body">
<form action="/action_page.php">
<label for="email">Email address:</label>
<input type="email" class="form-control" placeholder="Enter email"
id="email">
</div>
<label for="pwd">Password:</label>
<input type="password" class="form-control" placeholder="Enter
password" id="pwd">
</div>
<div class="form-group form-check">
<label class="form-check-label">
<input class="form-check-input" type="checkbox"> Remember me
</label>
</div>
<center> <button type="submit" class="btn btn-
warning">Submit</button></center>
</form>
</div>
<div class="modal-footer">
<a href="#">Forgot Password?</a>
</div>
</div>
</div>
</div>


<div id="myCarousel" class="carousel slide">
<ul class="carousel-indicators">
<li class="item1 active"></li>
<li class="item2"></li>
<li class="item3"></li>
</ul>
<div class="carousel-inner">
<div class="carousel-item active">
<img src="https://hips.hearstapps.com/hmg-prod.s3.amazonaws.com/images/the-
50-best-books-of-2021-1638561516.jpg" alt="book" width="1550" height="750">
</div>
<div class="carousel-item">
<img src="https://www.barnesandnoble.com/blog/wp-
content/uploads/2020/11/BestBooksoftheYear_BlogBanner_11-05.jpg" alt="book"
width="1550" height="750">
</div>
<div class="carousel-item">
<img src="https://hips.hearstapps.com/hmg-
prod.s3.amazonaws.com/images/summer-books-2021-1622746902.jpg" alt="book"
width="1550" height="750">
</div>
</div>
<a class="carousel-control-prev" href="#myCarousel">

<span class="carousel-control-prev-icon"></span>
</a>
<a class="carousel-control-next" href="#myCarousel">
<span class="carousel-control-next-icon"></span>
</a>
</div>


<div class="container mt-3">
<br>
<br>

<div class="alert alert-warning alert-dismissible" id="myAlert">
<button type="button" class="close">×</button>
<strong>Hurry Up!</strong> Limited time offer. ScrollDown to know more.
</div>

<br><br>


<ul class="nav nav-tabs">
<a class="nav-link text-dark active" href="#BestSelling">Best Selling</a>
</li>
<a class="nav-link text-dark" href="#TopViews">Top Views</a>
</li>

<a class="nav-link text-dark" data-toggle="popover" title="Suprise" data-
content="30% off on anybooks you choose" href="#TopRanking">Top Ranking</a>
</li>

</ul>
<div id="BestSelling" class="container tab-pane active"><br>
<h3>Best Selling</h3>
<table class="table table-hover">
<tbody>
<tr>
<td><img src="https://m.media-amazon.com/images/I/71jte84ADvL.jpg"
alt="book" width="70" height="120"></td>
<td>
<center><b>Verity</b></center>
</td>
</tr>
<tr>
<td><img src="https://m.media-amazon.com/images/I/51u8ZRDCVoL.jpg"
<td>
<center><b>Rich Dad Poor Dad</b></center>
</td>
</tr>
<tr>
<td><img src="https://encrypted-
tbn0.gstatic.com/images?q=tbn:ANd9GcQdzgMTSyeOYRybP7MYASPO-
tow0V63om66pJnjQwwhcSPinozmZ0AGntNSbUMQ3V8f09E&usqp=CAU" alt="book"
width="70" height="120"></td>
<td>
<center><b>The Little Prince</b></center>
</td>
</tr>
<tr>
<tr>
<td><img src="https://m.media-
amazon.com/images/I/81s0B6NYXML.jpg" alt="book" width="70" height="120"></td>
<td>
<center><b>It Ends with Us</b></center>
</td>
</tr>
</tbody>
</table>
</div>
<div id="TopViews" class="container tab-pane fade"><br>

<h3>Top Views</h3>
<tbody>
<tr>
<td>
</td>
</tr>
<tr>
<td>
</td>
</tr>
<tr>
<td>
</td>
</tr>
<tr>
<td>
</td>
</tr>
</tbody>
</table>
</div>
<div id="TopRanking" class="container tab-pane fade"><br>
<h3>Top Ranking</h3>
<tbody>
<tr>
<td>
</td>
</tr>
<tr>
<td>
</td>
</tr>
<tr>
<td>
</td>
</tr>
<tr>
<td>
</td>
</tr>
</tbody>
</table>
</div>
</div>

<br>

<div class="dropdown">
<center><button type="button" class="btn btn-warning dropdown-toggle" data-
toggle="dropdown">
Popular Genres
</button>
<div class="dropdown-menu">
<a class="dropdown-item" href="#hor">Horror</a>
<a class="dropdown-item" href="#thr">Thriller</a>
<a class="dropdown-item" href="#adv">Adventure</a>
</div>
</center>
</div>


<br>

<center><button type="button" id="knowmore" class="btn btn-warning">Know More

about BNetTimes</button></center>
<div class="collapse">
<center> With over 25 million books. Browse through variety of genres such as
Fiction, Self help, Children's books, School textbooks, Higher education textbooks, etc,.
Browse our massive collection of over 2 million used books. Choose the books from the price
range and based on the reviews. Enjoy millions of eBooks, including bestsellers and novels,
with a free trial. Choose from award-winning books and new releases.</center>
</div>

<br>

<h4 id="fanta">Fantasy Novels</h1>

<br>
<p>Fantasy is a genre that uses magic and other supernatural forms as a primary
element of plot, theme, and/or setting. Fantasy is generally distinguished from science fiction
and horror by the expectation that it steers clear of technological and macabre themes,
respectively, though there is a great deal of overlap between the three (collectively known as
speculative fiction or science fiction/fantasy)</p>
<br><br><br
<h4 id="adv">Adventure Novels</h1>

<br>
<p>The first adventure novel that you ever read is hard to forget: after all, we all
remember the first time our imaginations were lit by whispers of buried treasure, lost worlds,
and faraway jungles. As Jane Eyre says: “It is in vain to say human beings ought to be
satisfied with tranquility: they must have action; and they will make it if they cannot find
it.”<br>
Luckily, we’ve made the act of finding action easy for you! We have 100 of the best
adventure books for you in this post, ranging from rollicking journeys over land to tales of
high-stakes survival on the sea. Who knows where your next book will take you? Let’s find
out.</p>
<br><br><br >
<h4 id="thr">Thriller Novels</h1>

<br>
<p> Thrillers are characterized by fast pacing, frequent action, and resourceful
heroes who must thwart the plans of more-powerful and better-equipped villains. Literary
devices such as suspense, red herrings and cliffhangers are used extensively. <br>
Thrillers often overlap with mystery stories, but are distinguished by the structure of their
plots. In a thriller, the hero must thwart the plans of an enemy, rather than uncover a crime
that has already happened. </p>
<br><br><br >
<h4 id="hor">Horror Novels</h1>
<br>
<p> Horror fiction is fiction in any medium intended to scare, unsettle, or
horrify the audience. Historically, the cause of the "horror" experience has often been the
intrusion of a supernatural element into everyday human experience. Since the 1960s, any
work of fiction with a morbid, gruesome, surreal, or exceptionally suspenseful or frightening
theme has come to be called "horror". Horror fiction often overlaps science fiction or fantasy,
all three of which categories are sometimes placed under the umbrella classification
speculative fiction.</p>
<br><br><br>
<h4 id="his">Historical Novels</h1>

<br>
<p> Generally speaking, historical fiction is any story that is set in a time
period in the past, but depending on who you ask, the criteria can be more - or less - stringent
than that. The Walter Scott Prize, created in 2010 to recognize excellence in UK, Irish, and
Commonwealth historical fiction, limits the definition to events that take place at least 60
years before publication, during a historical period with which the author has no personal
experience.</p>

</div>

<script>
$(document).ready(function() {
$("#myCarousel").carousel();
$("#myCarousel").carousel(0);
});
});
});
$(".carousel-control-prev").click(function() {
$("#myCarousel").carousel("prev");
});
$(".carousel-control-next").click(function() {
$("#myCarousel").carousel("next");
});
$(".close").click(function() {
$("#myAlert").alert("close");
});
$("#bt").click(function() {
$("#myLogin").modal();
});
$(".nav-tabs a").click(function() {
$(this).tab('show');
});
$(".dropdown-toggle").dropdown();
$('[data-toggle="tooltip"]').tooltip();
$('[data-toggle="popover"]').popover();
$('body').scrollspy({
target: ".navbar",
offset: 50
});
$("#knowmore").click(function() {
$(".collapse").collapse('toggle');
});
});
</script>

</body>
</html>
OUTPUT:
EX.NO : 5
DATE : Arrays in PHP
AIM:
To Construct a Program Arrays in PHP.
PROCEDURE:
• Open NetBeans IDE and create new PHP file under PHP Project.
• Open HTML Tag.
• Create class for Jumbotron, Navigation tabs and Dropdown Menu.
• Open PHP Tag for each Dimension.
• Declare values for each Dimension arrays.
PROGRAM:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title></title><link rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>
</head>
<body>
<div class="jumbotron">
<h1>ARRAYS</h1>
</div>
<ul class="nav nav-tabs" role="tablist">
<li class="active"><a href="#indexarray" role="tab" data-toggle="tab">index array</a></li>
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">associative <b
class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#singledimensiontab" role="tab" data-toggle="tab">singledimension</a></li>
<li><a href="#multidimensiontab" role="tab" data-toggle="tab">multidimension</a></li>
</ul>
</li>
</ul>
</li>

<div class="tab-pane active" id="indexarray">
<?php
$cars = array("Volvo", "BMW", "Toyota");
echo "I like " . $cars[0] . ", " . $cars[1] . " and " . $cars[2] . ".";
?></div>
<div class="tab-pane" id="singledimensiontab">
<?php
$age = array("Peter"=>"35", "Ben"=>"37", "Joe"=>"43");

echo "Peter is " . $age['Peter'] . " years old.";
?>
</div>
<div class="tab-pane" id="multidimensiontab">
<?php
$cars = array
(
array("Volvo",22,18),
array("BMW",15,13),
array("Saab",5,2),
array("Land Rover",17,15)
);
echo $cars[0][0].": In stock: ".$cars[0][1].", sold: ".$cars[0][2].".<br>";
?>
</div>
</body>
</html>
OUTPUT:
EX.NO : 6
DATE : Functions using PHP
AIM:
To construct functions using PHP.
PROCEDURE:
• Open NetBeans IDE and create new PHP file under PHP project.
• Open HTML and PHP tag.
• To create an array function to call the PHP file.
• We can also create a String function to call the PHP file.
• Create call by value and call by reference in PHP file.
• Close tags
• Run the HTML file to execute the output.
PROGRAM CODING:
<html>
<div class="jumbotron">
<h1>Bootstrap Tutorial</h1>
<ul class="nav nav-tabs">
<li class="active"><a href="#">Home</a></li>
<a class="dropdown-toggle" data-toggle="dropdown" href="#">Pre-Defined <span
class="caret"></span></a>
<li><a href="arrayfun.php">Array</a></li>
<li><a href="strfun.php">String</a></li>
</ul>
</li>
<a class="dropdown-toggle" data-toggle="dropdown" href="#">Pre-Defined <span
class="caret"></span></a>
<li><a href="valuefun.php">Call by Value</a></li>
<li><a href="reffun.php">Call by Reference</a></li>
</ul>
</li>
</ul>
</div>
</html>
ARRAY FUNCTION:
<html>
<?php
$fname=array("Peter","Ben","Joe");
$age=array("35","37","43");
$c=array_combine($fname,$age);
print_r($c);
?>
<a href="func.php" class="btn btn-warning">HOME</a>
</html>
STRING FUNCTION:
<html><?php
$str = "Hello world. It's a beautiful day.";
print_r (explode(" ",$str));
?>
</html>
CALL BY VALUE:
<html>
<?php
function increment($i)
{
$i++;
}
$i = 10;
echo "The original value is:".$i."<br>";
increment($i);
echo "The value after function Call by Value:".$i;
?>
</html>
CALL BY REFERENCE:
<html>
<?php
function increment(&$i)
{
$i++;
}
$i = 10;
echo "The original value is:".$i."<br>";
increment($i);
echo "The value after function Call by Reference:".$i;
?>
</html>
OUTPUT:
EX.NO. : 7
DATE : Object Oriented Programming in PHP
AIM:
To write a program for object oriented programming concepts like Class,
Object, Constructor and inheritance.
PROCEDURE:
• Open NetBeans IDE , and create PHP project

• Create a HTML file to set frames and headings.
• Create another HTML file for displaying OOP’s concepts.
• Open separate PHP files for Classes, Objects, Constructor and Inheritance.
• Compile the HTML file for output.
PROGRAM CODING:
OOPS MAIN:
<html>
<head>
<title></title>
</head>
<FRAMESET COLS="25%,*">
<FRAME SRC="oopsprg.html" NAME=left>
<FRAMESET ROWS="25%,75%">
<FRAME SRC="oopshead.html" NAME=topright>
<FRAME SRC="" NAME=bottomright>
</FRAMESET>
</FRAMESET>
</html>
OOPS HEADING:
<!DOCTYPE html>
<html>
<head>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
</head>
<body>
<div class="jumbotron bg-success">
<h1><center><font color="pink"> OOPs Concepts </font></center></h1>
</div>
<p>The term <b><mark>"OOP stands for Object-Oriented Programming."</mark> </b>
object-oriented programming is about creating objects that contain both data and functions
together.</p>
</body>
</html>
OOPS PROGRAM:
<<!DOCTYPE html>
<html lang="en">
<head>
<script
</head>
<body>
<h2>Session Operations</h2>
<div class="list-group">
<a href="class_object.php" target="bottomright" class="list-group-item list-group-item-
success">Class-Object</a>
<a href="constructor.php" target="bottomright" class="list-group-item list-group-item-
danger">Constructor</a>
<a href="inheritance.php" target="bottomright" class="list-group-item list-group-item-
warning">Inheritance</a>
</div>
</div>
</body>
</html>
CLASS & OBJECT:
<?php
class Fruit {
// Properties
public $name;
public $color;
// Methods
function set_name($name) {
$this->name = $name;
}
function get_name() {
return $this->name;
}
function set_color($color) {
$this->color = $color;
}
function get_color() {
return $this->color;
}
}
$apple = new Fruit();

$apple->set_name('Apple');
$apple->set_color('Red');
echo "Name: " . $apple->get_name();
echo "<br>";
echo "Color: " . $apple->get_color();
?>
CONSTRUCTOR:
<?php
class Fruit {
public $name;
public $color;
function __construct($name, $color) {
}
function get_name() {
return $this->name;
}
function get_color() {
return $this->color;
}
}
$apple = new Fruit("Banana", "Yellow");
echo $apple->get_name();
echo "<br>";
echo $apple->get_color();
?>
INHERITANCE:
<?php
class Fruit {
public $name;
public $color;
public function __construct($name, $color) {
}
public function intro() {
echo "The fruit is {$this->name} and the color is {$this->color}.";
}
}
// Strawberry is inherited from Fruit
class Strawberry extends Fruit {
public function message() {
echo "Am I a fruit or a berry?";
}
}
$strawberry = new Strawberry("Strawberry", "red");
$strawberry->message();
$strawberry->intro();
?>
OUTPUT:
EX.NO. : 8
DATE : FORM VALIDATION
AIM :
To write a program for form validation using PHP.
PROCEDURE :
• Open Netbeans IDE and create new PHP file under PHP Project
• Open html and PHP tag.
• Create Variables for name, email, gender, comment and website along with error
variables for name, email, gender, comment.
• If the server request mode is post, then check preg_match for email and website & use
trim function for name, email, gender, comment and website.
• Close PHP tag and open another html tag and create form to validate the form.
• Show the output using isset method.
• Close tags.
PROGRAM :
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
href="https://maxcdn.bootstrap.com/bootstrap/3.4.0/css/bootstrap.min.css">
<script src="https://ajax.googleapi.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script
src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>
</head>
<body>
<?php
$nameErr=$emailErr=$genderErr=$websiteErr="";
$name=$email=$gender=$comment=$website="";
if($_SERVER["REQUEST_METHOD"]=="POST"){
if(!preg_match("/^[a-zA-Z]*$/", trim($_POST["name"]))){
$nameErr="Only letters and white space allowed";
}
else{
$name=trim($_POST["name"]);
}
if(!preg_match("/^[a-zA-Z0-9._-]+@[a-zA-Z]+\.[a-zA-Z]*$/",trim($_POST["email"]))){
$emailErr="Email is not in format";
}
else{
$email=trim($_POST["email"]);
}
if(!preg_match("/[w]+\.[a-zA-Z]+\.[c][o][m]/", trim($_POST["website"]))){
$websiteErr="Follow www.websitename.com pattern";
}
else{
$website=trim($_POST["website"]);
}
$comment=trim($_POST["comment"]);
if(empty($_POST["gender"])){
$genderErr="Gender is required";
}
else{
$gender=trim($_POST["gender"]);
}
}
?>
<h2>PHP Form Validation</h2>

<p><span class="error">*required field</span></p>
<form method="post" action="<?php echo($_SERVER["PHP_SELF"]); ?>">
Name:* <input type="text" name="name" required>

<?php echo $nameErr;?>
<br><br>
Email:* <input type="email" name="email">
<?php echo $emailErr;?>
<br><br>
Website:<input type="text" name="website" required>
<span class="error"><?php echo $websiteErr; ?></span>
<br><br>
Comment:<textarea name="comment" row="5" cols="40" required></textarea>
<br><br>
Gender:*
<input type="radio" name="gender" value="female">Female
<input type="radio" name="gender" value="male">Male
<input type="radio" name="gender" value="other">Other
<span class="error"><?php echo $genderErr; ?></span>
<br><br>
<input type="submit" name="submit" value="Submit">
</form>
<?php
if(isset($_POST['submit'])){
echo "<h2>Your Input</h2>";
echo "Name: ".$name;
echo "<br>";
echo "Email: ".$email;
echo "<br>";
echo "Website: ".$website;
echo "<br>";
echo "Comment: ".$comment;
echo "<br>";
echo "Gender: ".$gender;
}
?>
</body>
</html>
OUTPUT :
EX.NO. : 9
DATE : Working with My SQL
AIM:
Write a program to work with MySQL.
PROCEDURE:
• Start XAMPP server by starting Apache and MySQL.

• Write PHP script for connecting to XAMPP.
• Run it in the local browser.
• Database is successfully created in MySQL code.
SYNTAX:
//To start MySQL:

mysql -u root -p
//To display default database:
show databases;
//Use mysql database from the above list:
use mysql;
//Show the list of table in the mysql database:
show tables;
//Quit from shell(to come out default database):
quit;
//To create a database:
CREATE database [database _name];
//To use the created database:
use database_name;
//To create table :
CREATE TABLE [table_name] (column1 datatype,column2 datatype,column3 datatype,);
//To insert new records in a table:
INSERT INTO[ table_name] (column1, column2, column3, ...)VALUES (value1, value2,
value3, ...);
//To display all field in table:
SELECT * from table_name;
//To display selected field from the table.
SELECT column1, column2, ...FROM table_name;
//To add a column in a table:
ALTER TABLE table_name ADD column_name datatype;
//To change the data type of a column in a table:
ALTER TABLE table_name MODIFY COLUMN column_name datatype;
//To change the name of table:
ALTER TABLE table_name RENAME TO new_table_name;
OUTPUT:
Open the shell window from the Xampp
Connect to the my sql.
Create database test1;

Tables created
Books and Authors
Records inserted
ALTER COMMANDS
SELECT COMMANDS
EX.NO. : 10
DATE : Database Connection using PHP
AIM:
Write a program to connect database in PHP.
PROCEDURE:
• Start XAMPP server by starting Apache and MySQL.

• Write PHP script for connecting to XAMPP.
• Run it in the local browser.
• Database is successfully created which is based on the PHP code.
PROGRAM CODING:
DATABASE INSERT:
<?php
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "employee";
// Create connection
$conn = mysqli_connect($servername, $username, $password, $dbname);
// Check connection
if (!$conn) {
die("Connection failed: " . mysqli_connect_error());
}
$sql = "INSERT INTO emp (empno,ename)

VALUES (40,'John')";
if (mysqli_query($conn, $sql)) {
echo "New record created successfully";
} else {
echo "Error: " . $sql . "<br>" . mysqli_error($conn);
}
mysqli_close($conn);
?>
DATABASE DISPLAY:
<?php
$servername = "localhost";
$username = "root";
$password = "";
$dbname = "employee";
// Create connection
$conn = mysqli_connect($servername, $username, $password, $dbname);
// Check connection
if (!$conn) {
die("Connection failed: " . mysqli_connect_error());
}
$sql = "SELECT empno,ename FROM emp";

$result = mysqli_query($conn, $sql);
if (mysqli_num_rows($result) > 0) {
// output data of each row
while($row = mysqli_fetch_assoc($result)) {
echo "id: " . $row["empno"]. " - Name: " . $row["ename"]. "<br>";
}
} else {
echo "0 results";
}
mysqli_close($conn);
?>
OUTPUT:
EX.NO. : 11
DATE : Cookies in PHP
AIM:
To create, display and destroy cookies using PHP.
PROCEDURE:
• Open NetBeans IDE and create new PHP file under PHP project.
• Open html file.
• Create a FRAMESET.
• Open another html file design the page.
• Create a cookie program to display and delete.
• Open PHP file to create a cookie using Variables name and value.
• Set cookie with name, value and time.
• Set the expiration date to delete a cookie.
• Close tags.
PROGRAM CODING:
COOKIE MAIN:
<html>
<head>
<title></title>
</head>
<FRAME SRC="cookieprg.html" NAME=left>
<FRAME SRC="cookiehead.html" NAME=topright>
</FRAMESET>
</FRAMESET>
</html>
COOKIE HEADING:
<!DOCTYPE html>
<html>
<head>
<script
</head>
<body>
<h1><center><font color="pink"> Cookie </font></center></h1>
</div>
<p>The term <b><mark>"Cookies"</mark> </b> are small files which are stored on a
user's computer. ... This allows the server to deliver a page tailored to a particular user, or the
page itself can contain some script which is aware of the data in the cookie and so is able to
carry information from one visit to the website (or related site) to the next.</p>
</body>
</html>
COOKIE PROGRAM:
<!DOCTYPE html>
<html lang="en">
<head>
<script
</head>
<body>
<h2>Cookie Operations</h2>
<a href="cookiecreate.php" target="bottomright" class="list-group-item list-group-item-
success">Creation</a>
<a href="cookiedisplay" class="list-group-item list-group-item-danger">Display</a>
<a href="cookiedelete.php" class="list-group-item list-group-item-warning">Destroy</a>
</div>
</div>
</body>
</html>
CREATE:
<!DOCTYPE html>
<?php
$cookie_name = "user";
$cookie_value = "amar";
setcookie($cookie_name, $cookie_value, time() + (86400 * 30), "/");
?>
<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];
}
?>
</body>
</html>
COOKIE DISPLAY:
<?php
if(!isset($_COOKIE["user"])) {
echo "Cookie named user is not set!";
} else {
echo "Cookie user is set!<br>";
echo "Value is: " . $_COOKIE["user"];
}
?>
COOKIE DELETE:
<?php
// set the expiration date to one hour ago
setcookie("user", "", time() - 3600);
?>
<html>
<body>
<?php
echo "Cookie 'user' is deleted.";
?>
</body>
</html>
OUTPUT:
EX.NO. : 12
DATE : Sessions in PHP
AIM:
To create, display and destroy sessions using PHP.
PROCEDURE:
• Open Netbeans IDE and create new PHP file under PHP project.
• Open html file.
• Create a FRAMESET.
• Open another html file design the page.
• Create a session program to create, read, display and delete.
• Open PHP file to start the session and set session variables.
• Echo session variables that were set on previous page.
• Display the session and destroy by removing all session variables
• Close the tags
SESSION MAIN:
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<FRAME SRC="sessionprg.html" NAME=left>
<FRAME SRC="sessionheading.html" NAME=topright>
</FRAMESET>
</FRAMESET>
</html>
SESSION HEADING:
<!DOCTYPE html>
<html>
<head>
<script
</head>
<body>
<h1><center><font color="pink"> SESSION </font></center></h1>
</div>
<p>The term <b><mark>"Session"</mark> </b> are small files which are stored on a
user's computer. ... This allows the server to deliver a page tailored to a particular user, or the
page itself can contain some script which is aware of the data in the cookie and so is able to
carry information from one visit to the website (or related site) to the next.</p>
</body>
</html>
SESSION PROGRAM:
<<!DOCTYPE html>
<html lang="en">
<head>
<script
</head>
<body>
<h2>Session Operations</h2>
<a href="sessioncreate.php" target="bottomright" class="list-group-item list-group-item-
success">Creation</a>
<a href="sessionread.php" target="bottomright" class="list-group-item list-group-item-
danger">Display</a>
<a href="sessiondisplay.php" target="bottomright" class="list-group-item list-group-item-
warning">Display all</a>
<a href="sessiondestroy.php" target="bottomright" class="list-group-item list-group-item-
warning">Destroy</a>
</div>
</div>
</body>
</html>
SESSION CREATE:
<?php
// Start the session
session_start();
?>
<!DOCTYPE html>
<html>
<body>
<?php
// Set session variables
$_SESSION["favcolor"] = "green";
$_SESSION["favanimal"] = "cat";
if ( !isset( $_SESSION['count'] ) )
$_SESSION['count'] = 1; else $_SESSION['count']++;
echo "Session variables are set.";
if ($_SESSION["count"]==1)
{
echo " 1 time visited";
}
else
{
echo "No of times visited = " . $_SESSION["count"]."";
}
?>
</body>
</html>
SESSION READ:
<?php
session_start();
?>
<!DOCTYPE html>
<html>
<body>
<?php
// Echo session variables that were set on previous page
echo "Favorite color is " . $_SESSION["favcolor"] . ".<br>";
echo "Favorite animal is " . $_SESSION["favanimal"] . ".";
echo "No. of times visited = " . $_SESSION["count"] . ".";
?>
</body>
</html>
SESSION DISPLAY:
<?php
session_start();
?>
<!DOCTYPE html>
<html>
<body>
<?php
print_r($_SESSION);
?>
</body>
</html>
SESSION DESTROY:
<?php
session_start();
?>
<!DOCTYPE html>
<html>
<body>
<?php
// remove all session variables
session_unset();
// destroy the session
session_destroy();
?>
</body>
</html>
OUTPUT:
EX.NO. : 13
DATE : AJAX in PHP
AIM:
To write a program to implement AJAX using PHP.
PROCEDURE:
• Create a program in html with the <script> tag where a function ‘showhint’ is created.
• It should check the PHP file for the given condition. If there is any name , it should
suggest that.
• In a PHP file, create an array with all the possible values in it.
• In that convert the content from HTML file into lowercase and check for it in the
array specified.
• Save and Run the HTML program to get the respective output.
PROGRAM CODING:
<!DOCTYPE html>
<html>
<head>
<script>
function showHint(str) {
if (str.length == 0) {
document.getElementById("txtHint").innerHTML = "";
return;
} else {
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("txtHint").innerHTML = this.responseText;
}
}
xmlhttp.open("GET", "gethint_1.php?q="+str, true);
xmlhttp.send();
}
}
</script>
</head>
<body>
<p><b>Start typing a name in the input field below:</b></p>

<form>
First name: <input type="text" onkeyup="showHint(this.value)">
</form>
<p>Suggestions: <span id="txtHint"></span></p>
</body>
</html>
PHP FILE:
<?php
// Array with names
$a[] = "Anna";
$a[] = "Brittany";
$a[] = "Cinderella";
$a[] = "Diana";
$a[] = "Eva";
$a[] = "Fiona";
$a[] = "Gunda";
$a[] = "Hege";
$a[] = "Inga";
$a[] = "Johanna";
$a[] = "Kitty";
$a[] = "Linda";
$a[] = "Nina";
$a[] = "Ophelia";
$a[] = "Petunia";
$a[] = "Amanda";
$a[] = "Raquel";
$a[] = "Cindy";
$a[] = "Doris";
$a[] = "Eve";
$a[] = "Evita";
$a[] = "Sunniva";
$a[] = "Tove";
$a[] = "Unni";
$a[] = "Violet";
$a[] = "Liza";
$a[] = "Elizabeth";
$a[] = "Ellen";
$a[] = "Wenche";
$a[] = "Vicky";
// get the q parameter from URL

$q = $_REQUEST["q"];
$hint = "";
// lookup all hints from array if $q is different from ""

if ($q !== "") {
$q = strtolower($q);
$len=strlen($q);
foreach($a as $name) {
if (stristr($q, substr($name, 0, $len))) {
if ($hint === "") {
$hint = $name;
} else {
$hint .= ", $name";
}
}
}
}
// Output "no suggestion" if no hint was found or output correct values

echo $hint === "" ? "no suggestion" : $hint;
?>
OUTPUT:

PHP Record

Uploaded by

Copyright:

Available Formats

PHP Record

Uploaded by

Document Information

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

PHP Record

Uploaded by

Copyright:

Available Formats

Shrimathi Devkunvar Nanalal Bhatt Vaishnav College for Women,

Re-Accredited with ‘A+’ Grade By NAAC.

M.Sc. (COMPUTER SCIENCE)

(First Year- I Semester)

ADVANCED WEB DESIGNING LAB

SUB CODE : ...........................................

CERTIFIED GENUINE RECORD OF WORK DONE BY.............................

LECTURER INCHARGE HEAD OF THE DEPARTMENT

Submitted for M.Sc Practical Examination held on

Working with MySQL

Grid System has five classes:

Responsive Web Page:

<ul class="navbar-nav ml-auto">

<a class="carousel-control-prev" href="#myCarousel">

<div id="TopViews" class="container tab-pane fade"><br>

<center><button type="button" id="knowmore" class="btn btn-warning">Know More

<h4 id="fanta">Fantasy Novels</h1>

<h4 id="adv">Adventure Novels</h1>

<h4 id="thr">Thriller Novels</h1>

<h4 id="his">Historical Novels</h1>

$age = array("Peter"=>"35", "Ben"=>"37", "Joe"=>"43");

To construct functions using PHP.

• Open NetBeans IDE , and create PHP project

$apple = new Fruit();

<h2>PHP Form Validation</h2>

Name:* <input type="text" name="name" required>

Write a program to work with MySQL.

• Start XAMPP server by starting Apache and MySQL.

//To start MySQL:

Open the shell window from the Xampp

Connect to the my sql.

Create database test1;

Books and Authors

Write a program to connect database in PHP.

• Start XAMPP server by starting Apache and MySQL.

$sql = "INSERT INTO emp (empno,ename)

$sql = "SELECT empno,ename FROM emp";

To create, display and destroy cookies using PHP.

<p><b>Start typing a name in the input field below:</b></p>

// get the q parameter from URL

// lookup all hints from array if $q is different from ""

// Output "no suggestion" if no hint was found or output correct values

You might also like