Overview of PHP and MYSQLOverview of PHP and MYSQL
Prepared By:
Deblina Chowdhury
Monoj Baitalik
Souvik Ghosh

ContentsContents
 HTML & CSS – Definition
 Why Use CSS?
 CSS Syntax
 JavaScript -Definition
 Why Study JavaScript?
 What can a JavaScript Do?
 What is jQuery?
 SOME IMPORTANT HTML-CSS-JAVASCRIPT PROPERTIES .
 PHP & MYSQL – Definition
 Three Tiered Architecture: XAMPP

Contents (Contents (cont’d)cont’d)
 PHP Codes- Variables and Sessions
 PHP Redirection and Include Files
 MYSQL Functions for Connection and Error
 MYSQL Functions Related to Queries
 Server Side Validation using PHP
 Exporting and Importing Data in MYSQL
 PDF Generation in PHP
 PDF Download in PHP
 Uploading Files with PHP
 Downloading Files with PHP

What is HTML?What is HTML?
• HTML stands for Hyper Text Markup Language
• HTML describes the structure of Web pages using markup
• HTML elements are the building blocks of HTML pages
• HTML elements are represented by tags
• HTML tags label pieces of content such as "heading", "paragraph", "table", and so on
• Browsers do not display the HTML tags, but use them to render the content of the page

What is CSS?What is CSS?
•CSS stands for Cascading Style Sheets
•CSS describes how HTML elements are to be displayed on screen, paper, or in
other media
•CSS saves a lot of work. It can control the layout of multiple web pages all at once
•External stylesheets are stored in CSS files
Why Use CSS?Why Use CSS?
CSS is used to define styles for your web pages, including the design, layout and
variations in display for different devices and screen sizes.

CSS SyntaxCSS Syntax
A CSS rule has two main parts: a selector, and one or more
declarations:
The selector is normally the HTML element you want to style.
Each declaration consists of a property and a value.
The property is the style attribute you want to change. Each property has a value.
CSS Example
CSS declarations always ends with a semicolon, and declaration groups are
surrounded by curly brackets:
p {color:red;text-align:center;}

What is JavaScript ?
Javascript is a dynamic computer programming language. It is lightweight
and most commonly used as a part of web pages, whose
implementations allow client-side script to interact with the user and make
dynamic pages.
Why Study JavaScript?
JavaScript is one of the 3 languages all web developers must learn:
1. HTML to define the content of web pages
2. CSS to specify the layout of web pages
3. JavaScript to program the behavior of web pages

What can a JavaScript Do?What can a JavaScript Do?
•
JavaScript gives HTML designers a programming tool.

JavaScript can react to events.

Validate data.

It can be used to detect the visitor's browser

Create cookies.

Read/write/modify HTML elements
What is jQuery?
jQuery is a JavaScript library. It makes things like HTML document traversal and manipulation,
event handling, animation, and Ajax much simpler with an easy-to-use API that works across a
multitude of browsers. jQuery greatly simplifies JavaScript programming .

SOMESOME IMPORTANTIMPORTANT CSS PROPERTIES :CSS PROPERTIES :
 .class Selector
• The .class selector selects elements with a specific class attribute.
• To select elements with a specific class, write a period (.) character, followed by the name of the
class.
• You can also specify that only specific HTML elements should be affected by a class. To do this,
start with the element name, then write the period (.) character, followed by the name of the
class .
Example
Select and style all elements with class="intro":
.intro {
background-color: yellow;
}
The #id selector styles the element with the specified id.
Example
Style the element with id="firstname":
#firstname {
background-color: yellow;
}
 #id Selector

SOME IMPORTANT CSS PROPERTIES :(cont’d)SOME IMPORTANT CSS PROPERTIES :(cont’d)
 Position
The position property specifies the type of positioning method used for an element (static, relative, absolute
or fixed).
Example
Position an <h2> element:
h2 {
position: absolute;
}
 :hover Selector
• The :hover selector is used to select elements when you mouse over them.
• :hover MUST come after :link and :visited (if they are present) in the CSS definition, in order to be
effective!
Example
Select and style a link when you mouse over it:
a:hover {
background-color: yellow;

 HTML <input> placeholder Attribute
• The placeholder attribute specifies a short hint that describes the expected value of an input field (e.g. a
sample value or a short description of the expected format).
• The short hint is displayed in the input field before the user enters a value.
Example
<input type="text" name="fname" placeholder="First name">
 HTML <span> Tag
• The <span> tag is used to group inline-elements in a document.
• The <span> tag provides no visual change by itself.
Example
<p>My mother has <span style="color:blue">blue</span> eyes.</p>
SOME IMPORTANT HTML PROPERTIES:SOME IMPORTANT HTML PROPERTIES:

 onsubmit Event
The onsubmit attribute fires when a form is submitted.
Example
Execute a JavaScript when a form is submitted:
<form onsubmit="myFunction()">
Enter name: <input type="text">
<input type="submit">
</form>
 onclick Event
The onclick event occurs when the user clicks on an element.
Example
Execute a JavaScript when a button is clicked:
<button onclick="myFunction()">Click me</button>
SOME IMPORTANT HTML PROPERTIES:(cont’d)SOME IMPORTANT HTML PROPERTIES:(cont’d)

 onblur Event
• The onblur attribute fires the moment that the element loses focus.
• Onblur is most often used with form validation code (e.g. when the user leaves a form field).
Example
Validate an input field when the user leaves it:
<input type="text" name="fname" id="fname" onblur="myFunction()">
 <script> Tag
• The <script> tag is used to define a client-side script (JavaScript).
• The <script> element either contains scripting statements, or it points to an external script file through the src
attribute.
Example
Write "Hello JavaScript!" with JavaScript:
<script>
document.getElementById("demo").innerHTML = "Hello JavaScript!";
</script>
SOME IMPORTANT HTML PROPERTIES:(cont’d)SOME IMPORTANT HTML PROPERTIES:(cont’d)

SOME IMPORTANT JAVASCRIPT PROPERTIES:SOME IMPORTANT JAVASCRIPT PROPERTIES:
 Window alert() Method
• The alert() method displays an alert box with a specified message and an OK button.
• An alert box is often used if you want to make sure information comes through to the user.
Example
Display an alert box:
alert("Hello! I am an alert box!!");
 getElementById() Method
The getElementById() method returns the element that has the ID attribute with the specified value.
Example
<script>
function myFunction() {
document.getElementById("demo").innerHTML = "Hello World";
}
</script>

SOME IMPORTANT JAVASCRIPT PROPERTIES:SOME IMPORTANT JAVASCRIPT PROPERTIES:
(cont’d)(cont’d)
 test() Method
• The test() method tests for a match in a string.
• This method returns true if it finds a match, otherwise it returns false.
 innerHTML Property
The innerHTML property sets or returns the HTML content (inner HTML) of an element.
Example
Change the HTML content of a <p> element with id="demo":
document.getElementById("demo").innerHTML = "Paragraph changed!";

What is PHP?What is PHP?
 PHP == ‘Hypertext Preprocessor’
 Open-source, server-side scripting language
 Used to generate dynamic web-pages
 PHP scripts reside between reserved PHP tags
 This allows the programmer to embed PHP scripts within
HTML pages

What is PHP ?(cont’d)What is PHP ?(cont’d)
 Interpreted language, scripts are parsed at run-time rather than
compiled beforehand
 Executed on the server-side
 Source-code not visible by client
 ‘View Source’ in browsers does not display the PHP code
 Various built-in functions allow for fast development
 Compatible with many popular databases

 MySQL is a database server
 MySQL is ideal for both small and large applications
 MySQL supports standard SQL
 MySQL compiles on a number of platforms
 MySQL is free to download and use
What is MySQL?What is MySQL?

Three-tiered Web Site: XAMPPThree-tiered Web Site: XAMPP
Client
User-agent: Chrome
Server
Apache Server
request
response
Database
MySQL
PHPPHP

What does PHP code look like?What does PHP code look like?
 Structurally similar to C/C++.
 Supports procedural and object-oriented paradigm (to some
degree)
 All PHP statements end with a semi-colon.
 Each PHP script must be enclosed in the reserved PHP tag.
<?php
………
…………
?>

Declaration Syntax: $<variablename> = <value>
Example: $var = "Hello world!";
$var = 5;
$var = 10.5;
PHP has no command for declaring a variable. It is
created the moment you first assign a value to it.
Display Syntax: echo $<variablename>
Example: echo $var //Output: ’Hello world’ or 5 or 10.5
PHP Variables & Display:PHP Variables & Display:

PHP Sessions:PHP Sessions:
A session is a way to store information (in variables) to be used
across multiple pages.
Function:
Start a Session: session_start()
Destroy a Session: session_destroy()
Variable Declaration Syntax:
$_SESSION [‘<variablename>’] = <value>
Destroy Syntax: session_unset() //For all Session
Variables
session_unset([‘<variablename>’] )

Redirection:Redirection:
Redirect to a new page:
header('Location:<url>’ )
Include Files:Include Files:
include 'filename';
require 'filename';
**Takes all the text/code/markup that exists in the specified file and
copies it into the file that uses the include statement.**

Functions for MySQL Connection and Error:Functions for MySQL Connection and Error:
Connecting a Host:
mysqli_connect($<servername>, $<username>, $<password>)
Selecting a Database:
mysqli_select_db(<connection variable>, ‘<database name>', );
Error Description:
mysqli_error(<connection variable>);
Exception:
die(<message>)

MySQL DML Queries:MySQL DML Queries:
Selection Query:
SELECT <column_name(s)> FROM <table_name>
SELECT <column_name(s)> FROM <table_name> WHERE
<condition>
Insert Query:
INSERT INTO <table_name> (column1, column2, column3,...)
VALUES(value1, value2, value3,...)
Update Query:
UPDATE table_name SET (column1=value, column2=value2,…)
WHERE <condition>

MySQL Query Related Functions:MySQL Query Related Functions:
$QUERY= “SELECT <column_name(s)> FROM <table_name>”;
Performs a query against the database:
$RESULT= mysqli_query(<connection name>,$QUERY);
Returns the number of rows in a result set:
$ROWNUM= mysqli_num_rows($RESULT );
Returns the current row of a result set:
mysqli_fetch_object ($RESULT )
mysqli_fetch_array($RESULT )

Server Side Validation:Server Side Validation:
Functions:
Empty Checking: empty(<attribute name>)
Alphabatic Checking: ctype_alpha(<attribute name>)
Pattern Checking: preg_match(<pattern>,<attribute name>)
Numeric Checking: is_numeric(<attribute name>)
String Length: strlen(<attribute name>)
String Comparison: strcmp(string1,string2)

ExportingExporting And Importing Data In MYSQLAnd Importing Data In MYSQL
 Export data graphically via phpMyAdmin
• Login to phpMyAdmin
• Select the database
• Select the export tab
• Click select all so that tables in your database are selected
• Under export tab, select sql
• Select the structure
• Select data
• Select save file as and choose preferred compression format
• Click on GO
 Mysql data will be downloaded to your default browser’s destination.

• Before the data can be imported, the database must be
created by the user.
• create a new database
• Select on import menu
• Locate sql file on your computer
• Click on GO
 Mysql data will be uploaded to the database.
Exporting And Importing Data In MYSQL (Cont…)Exporting And Importing Data In MYSQL (Cont…)
 Import data graphically via phpMyAdmin

 Data can be imported from a XML source:
<form action="" method="post" enctype="multipart/form-data" name="form1"
id="form1">Choose your file: <br />
<input name="csv" type="file" id="csv" /><input type="submit" name="Submit"
value="Submit" /></form>
 Data can be retrieved from MYSQL in XML format:
header('Content-type: application/csv');
header('Content-Disposition: attachment; filename=toy.csv');
echo $csv_header . $csv_row;
 Other ways of Exporting And Importing of Data
Exporting And Importing Data In MYSQL (Cont…)Exporting And Importing Data In MYSQL (Cont…)

PDF Generation in PHPPDF Generation in PHP
 What is PDF?
 Portable Document Format (PDF) is a file format used to present and exchange
documents reliably, independent of software, hardware, or operating system.
 Invented by Adobe, PDF is now an open standard maintained by the International
Organization for Standardization (ISO).
 PDFs can contain links and buttons, form fields, audio, video, and business logic.
 They can also be signed electronically and are easily viewed using free Acrobat
Reader DC software.

 Why Create PDF?
• Because your client wants one
• Because you need pixel-perfect positioning on printed pages
• Because you want to have a 'saveable' page
• Because you want an 'immutable' page
• Because some things are done easier in PDFs then HTML
• Because you may want a password protected document
• Because you want to create the impression of a document
PDF Generation in PHP (Cont….)PDF Generation in PHP (Cont….)

 What is FPDF?
• PHP has several libraries for generating PDF documents. We will
use the popular fpdf library.
• The FPDF is an existing library. It is a set of PHP code you
include in your scripts with the require function.
• FPDF is a PHP class which allows to generate PDF files with
pure PHP. F from FPDF stands for Free.
 This library (FPDF) is available at http://www.fpdf.org
PDF Generation in PHP (Cont….)PDF Generation in PHP (Cont….)

 FPDF class functions used
FPDF : constructor
SetTopMargin : set top margin
SetLeftMargin : set left margin
SetAutoPageBreak : set the automatic page breaking mode
AddPage : add a new page
SetFont : set font face, style, size
Image : output an image
GetStringWidth : compute string length
Cell : print a cell
Ln : line break
SetXY : set current x and y positions
Output : save or send the document
PDF Generation in PHP (Cont….)PDF Generation in PHP (Cont….)

<?php
require_once("fpdf.php");
$fpdf = new FPDF();
$fpdf->AddPage();
$fpdf->SetFont( 'Arial', 'B', 16 );
$fpdf->Cell( 0, 9, 'Pdf generation', 1, 1,
'C' );
$fpdf->Cell( 0, 9, 'It is a pdf file.......', 0, 0,
'C' );
$fpdf->Output();
?>
//Include the class library
//Create a new class object
//Add a page to the PDF document
//Set the font
//Create a 'cell' and put some text into it
//Output the PDF file
 A brief Example:
PDF Generation in PHP (Cont….)PDF Generation in PHP (Cont….)

 Object Tag And Attributes:
The <object> tag defines an embedded object within an HTML document. Use this
element to embed multimedia (like audio, video, Java applets, ActiveX, PDF, and
Flash) in your web pages.
data URL Specifies the URL for
Object data.
width pixels Specifies the width of the
object.
height pixels
Specifies the height of the
object.
PDF Download in PHPPDF Download in PHP

<html>
<div>
<object align="middle" width="100%" height="100%" type="application/pdf“
data="c++_note_3.pdf >
</object>
</div>
</html>
 A Brief Example:
PDF Download in PHP (Cont…)PDF Download in PHP (Cont…)

Uploading a File with PHPUploading a File with PHP
<form enctype="multipart/form-data" action="index.php"
name="form" method="post">
<input type="submit" name="submit" id="submit"
value="Submit" />
</form>
• The ENCTYPE sets the type of data to be sent by the form.
Setting the field TYPE to file gives a button to launch the
browser's file dialog.
 Form:

$name=$_FILES['photo']['name'];
$size=$_FILES['photo']['size'];
$type=$_FILES['photo']['type'];
$temp=$_FILES['photo']['tmp_name'];
move_uploaded_file($temp,"files/".$name);
Uploading a File with PHP (Cont….)Uploading a File with PHP (Cont….)
 PHP File:

 When the form is submitted to the server the file is uploaded. It is
placed in a temporary location and information about it is stored in
$_FILES. The middle two lines set up some variables. The first
holds the name of the file which was uploaded. The second one
holds the name it has been given temporarily.
 The built-in PHP function move_uploaded_file() moves the
temporary file to its intended location and renames it. Normally
that would be in a special "uploads" directory for security.
Uploading a File with PHP (Cont….)Uploading a File with PHP (Cont….)

 The $_FILES Array
Index Meaning
name The original name of the file (as it was on the user's
computer).
type The MIME type of the file, as provided by the browser.
size The size of the uploaded file in bytes.
tmp_name The temporary filename of the uploaded file as it was
stored on the server.
error The error code associated with any problem.
Uploading a File with PHP (Cont….)Uploading a File with PHP (Cont….)

 Some functions:
• fgets()
– Reads data, stops at newline or end of file (EOF)
• fread ()
– Reads data, stops at EOF.
We need to be aware of the End Of File (EOF) point..
• feof()
– Whether the file has reached the EOF point. Returns true if have reached
EOF.
• fwrite ()
– Write data to the file.
Downloading a File with PHPDownloading a File with PHP

function output_file($file, $name, $mime_type=''){
$size = filesize($file);
$known_mime_types=array(
"pdf" => "application/pdf",
"txt" => "text/plain",
"html" => "text/html",
"htm" => "text/html",
"exe" => "application/octet-stream",
"zip" => "application/zip",
"doc" => "application/msword",
"xls" => "application/vnd.ms-excel",
"ppt" => "application/vnd.ms-powerpoint",
"gif" => "image/gif",
"png" => "image/png",
"jpeg"=> "image/jpg",
"jpg" => "image/jpg",
"php" => "text/plain"
);}
$file_path='files/'.$_REQUEST['filename'];
output_file($file_path, ''.$_REQUEST['filename'].'', 'text/plain');
Downloading a File with PHP (Cont….)Downloading a File with PHP (Cont….)