php [Mode de compatibilité]croitoru/php.pdf · Practicals Th d f l tThe password form element

60
<php> Madalina Croitoru <php> Madalina Croitoru [email protected] </php>

Transcript of php [Mode de compatibilité]croitoru/php.pdf · Practicals Th d f l tThe password form element

<php>Madalina Croitoru

<php>Madalina Croitoru

[email protected]

</php>p p

O iOverview

Part I: Portraying the Internet as a collection of online information systemssystemsPart II: Design a website usingHTML/XHTML & CSSHTML/XHTML & CSSPart III: use of PHP

FForm

Form

…it’s still a form just that Sign In replaces Submit

D i Th FDesign The Form

f(X)HTML includes elements/tags for the creation of forms on Web pagesh hThere are three stages to creating

a form:d fi th f d t [ t f 1. define the form data [a set of variables]

2 design the form itself2. design the form itself3. define the method for processing the

form’s data on the server-side

E lExample

name

id

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"// // //"http://www.w3.org/TR/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"><head><title>Query Form</title>Q y /<meta http-equiv="Content-type" content="text/html;

charset=iso-8859-1" /><meta http-equiv="Content-Language" content="en-us" /><style type="text/css">y yp /

body, html {font-family:"Trebuchet MS", verdana, arial, sans-serif;}

</style>/ y</head><body><h2>Query Form</h2><form method="get" action="doquery.php">o et od get act o doque y.p p<p>Your name: <input name="name" type="text" size="30" /></p><p>Your ID: <input name="id" type="text" size="15" /></p><p><input type="submit" value="Submit your query" /></p>< ><i t t " t" l "Cl " /></ ><p><input type="reset" value="Clear your query" /></p></form></body></html>

This form contains our two variables, name and id

E l i bl & b i iExample: variables & submission

<input name="name" type="text" size="30" />

<input name="id" type="text" size="15" />

<input type="submit" value="Submit your query" />

<input type="reset" value="Clear your query" />

Form Methodsget pass the data in a HTTP get requestget pass the data in a HTTP get requestpost pass the data in a HTTP post request

In a HTTP get request, the browser appends th f d t t URLthe form data to a URLThe variable names and values are appended to the URL with a ? Any spaces in a value are the URL with a ? Any spaces in a value are converted to +

http://www.csd.abdn.ac.uk/~schalmer/teaching/examples/lecture17-forms/doquery.php?name=STuart+Chalmers&id=1234567

doquery.php?name=STuart+Chalmers&id=1234567

HTTP tHTTP post

fpost sends the information in the body of the submission

d h f ll l lconsider the following google url…

G l i tGoogle query using get

http://www.google.co.uk/search?hl=en&q=st+mirren&btnG=Google+Search&meta=

B k k Th S hBookmark The Search

If b k k hi hIf you bookmark this search:The information in the google search query has been passed using HTTP getquery has been passed using HTTP get

We could not do this with http postInformation not passed via URI

HTTP post

<form method=“post" action= "doquery.php">

Thi f th HTTP t th dThis form uses the HTTP post method

The Script

doquery.php [this is a PHP script]The script will be passed the variables & values, The script will be passed the variables & values, and can then process themFor example, the PHP script could use the name & id to look up student info in a database...

HTTP form processing

1. user fills in form & clicks submit

2. Browser sends GET http://www.csd.abdn.ac.uk/doquery.php?name=joe+bloggs&id=1234

5 Browser 4 server sends 3 server runs 5. Browser displays the script

lt *

4. server sends script results to

Browser

3. server runs the script doquery.php

i f internet

results* passing form data to it

*The script results will usually be (X)HTML text

Th di f l tThe radio form element

<p><input name="status" type="radio" value="undergraduate" p p yp gchecked="checked" /> Undergraduate

<input name="status" type="radio" value="postgraduate" /> Postgraduate<input name="status" type="radio" value="staff" /> Staff</p>

Th h kb f l tThe checkbox form element

Th h kb f l tThe checkbox form element

<p><input name = "lectures" type="checkbox" checked="checked" />Lectures<input name = "tutorials" type="checkbox" checked="checked" />Tutorialsi i l h kb<input name = "practicals" type="checkbox"

checked="checked" />Practicals</p>

Th d f l tThe password form element

<p>Enter the secret password: <input name="email" type="password" size="25" /></p>

Th l t f l tThe select form element

Th l t f l tThe select form element

<p>< l t " "><select name="course"><option selected="selected">Please select an option…</option><option>CS1513 Web Technology</option><option>CS1513 Web Technology</option><option>CS5548 Web Technology</option><option>Other</option></select>/se ect</p>

Th t t f l tThe textarea form element

Th t t f l tThe textarea form element

<p>Leave a comment<br /><textarea name="comments" rows="4" cols="45">No comment.</textarea></p>

B tt f l tButton form elements

<p><input type="submit" value="Submit your query" /></p><p><input type= submit value= Submit your query /></p><p><input type="reset" value="Clear your query" /></p>

CSS d fCSS and forms

CSS d fCSS and forms

Select menu has been styled, with various ‘main’ and ‘sub’ options

CSS d fCSS and forms

body, html {font-family:"Trebuchet MS", verdana, arial, sans-serif; background-color:#CCCC99;}sans serif; background color:#CCCC99;}

input.purple {background-color: #9999CC; font-weight: bold; color: black;}

textarea.purple {background-color: #9999CC;}#option.main {background-color: #999999; font-weight: bold;

color: white;}option.sub {background-color: #9999CC;}

CSS d fCSS and forms

<select size="1" name="selectMenuCSSDemo"><option selected="selected"> -- Select An Option -- </option><option class="main" value="main1">Main Option 1</option><option class="sub" value="sub1a">- Sub Option 1a -</option><option class="sub" value="sub1b">- Sub Option 1b -</option><option class="sub" value="sub1c">- Sub Option 1c -</option><option class= sub value= sub1c > Sub Option 1c </option><option>- - - - - - - - - - - - - - - </option>……

S id iServer-side processing

fSo far: We’ve created a webpage that contains a forma formWe’ve put in some data in the formWhat is a file with a php extension?What is a file with a .php extension?What does it do with the data?

S B i PHPSome Basic PHP

PHP A h hiPHP – A short historyCreated 1994 by Rasmus Lerdorf(Personal Home Page Tools)(Personal Home Page Tools)Became Apache Software Foundation projectp jName change to PHP Hypertext PreprocessorUsed by 7 million sites

http://www.php.net/manual/en/introduction.php

S f ith d hSo our form with doquery.php

Wh t h h th i bl b itt d What happens when the variables submitted in the are passed to doquery.php?

A l i PHP t fApplying PHP to your forms

As can be seen, the recipient PHP script prints out our submitted data

doquery.php<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">

<head>

<title>Query Form</title>

< t htt i "C t t t " t t "t t/ht l h t i 8859 1" /><meta http-equiv="Content-type" content="text/html; charset=iso-8859-1" />

<meta http-equiv="Content-Language" content="en-us" />

<style type="text/css">

body, html {font-family:"Trebuchet MS", verdana, arial, sans-serif;}

</style>

</head></head>

<body>

<h2>Submission From Your Form</h2>

<p>Remember that the form contained the following elements:</p>

<ul>

<li>name text entry box that we had called 'name'</li>

<li>ID text entry box that we had called 'id'</li>

<li>Submit button</li>

<li>Clear button</li>

</ul>

<?php

<?phpecho ("<p>Name: ".$name."</p>");

echo ("<p>Name: ".$name."</p>");

echo ("<p>ID : ".$id."</p>");

?>

</body>

</html>

( p $ /p );echo ("<p>ID : ".$id."</p>");

?>

S id i f hServer-side processing of php

fThink of php as:Telling server what html to write:i h i ll di l d bi.e. what is actually displayed by:

<?phpecho ("<p>Name: " $name "</p>");echo ( <p>Name: .$name. </p> );echo ("<p>ID : ".$id."</p>");

?>

Object Oriented Programming i PHPin PHP

Obj t O i t ti M d l dObject Orientation: Modular code

fWill exemplify by 2 php pages:index.php (uses the concepts called with php include)with php include)class_lib.php (will contain the OO code)

ClClasses

Templates used to create objectsGroups together related functions,

blvariables etc.<?php

class person {

}?>

Add d t t th l ( ti )Add data to the class (properties)

O diff b t f ti d One difference between functions and classes is that:

class contains both data (variables) andclass contains both data (variables) andfunctions that form a package called an: 'object'.

<?php<?phpclass person {

var name;var name;

}}?>

Add functions to the class (methods)<?php

class person {class person {

var $name;

function set name($new name) {function set_name($new_name) {

$this->name = $new_name;

}}

function get_name() {

et n $this >namereturn $this->name;

}

}}?>

G t d t th dGet and set methods<?phpclass person {

var $name;

function set name($new name) {function set_name($new_name) {

$this->name = $new_name;

}}

function get_name() {

return $this->name;

}

}?>

Th $thi i blThe $this variable

function get_name() {

return $this->name;

}

U i OO i PHPUsing OO in PHP

Access your php objects/classes by l d h hincluding them in your main php

pages with either a php 'include' or 'require' or 'require'.

I l d OO i PHP lInclude OO in PHP - example

<!DOCTYPE html PUBLIC " //W3C//DTD <!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional dtd">1 transitional.dtd ><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><title>OOP in PHP</title><title>OOP in PHP</title><?php include("class_lib.php"); ?></head><body></body></html>

I t ti t lInstantiate your classes

? h i l d (" l lib h ") ?<?php include("class_lib.php"); ?></head>

b d<body><?php

$ d li ()$madalina = new person();?>

</b d ></body></html>

Th k dThe new keyword

? h i l d (" l lib h ") ?<?php include("class_lib.php"); ?></head><body><body><?php

$madalina = new person();$madalina = new person();$jimmy = new person;

?>?></body></html></html>

S t bj t tiSet object properties

<?php include("class lib php"); ?><?php include( class_lib.php ); ?></head><body><?php

$madalina = new person();$jimmy = new person;j y p

$madalina->set_name(“Madalina Croitoru");$jimmy->set_name(“Jimmy Page");

?></body>

</html>

A i bj t’ d tAccessing an object’s data

echo “Madalina's full name: " . $madalina->get_name();g ()

echo “Jimmy's full name: " . $jimmy->get_name();

Constructors<?phpclass person {

var $name;

function construct($persons name) {function __construct($persons_name) {$this->name = $persons_name;

}

function set name($new name) {function set_name($new_name) {

$this->name = $new_name;

}

function get_name() {

return $this->name;

}}}?>

C t bj t ith t tCreate an object with a constructor

<?php

$madalina = new person(“Madalina Croitoru");

echo “Madalina's full name: " . $madalina->get_name();

?>

PHP AND MYSQL

PHP d M SQLPHP and MySQL

fPHP has functions that allow access to MySQL DatabasesAccess is very easy

1. Connect2 S l t D t b2. Select Database3. Query4 Close connection4. Close connection

1 C t1. Connect

$ i ($link = mysql_connect('mysql_server',

'mysql_user',

'mysql_password');

2 S l t D t b2. Select Database

$link = mysql connect('mysql server',

'mysql_user',

'mysql password');'mysql password');

$db selected = mysql select db(‘name',$db_selected mysql_select_db( name ,

$link);

3 Q3. Query

$li k l ( l$link = mysql connect('mysql server',

'mysql_user',

'mysql_password');

$db_selected = mysql_select_db(‘name',

$link);

$result = mysql_query("DELETE FROM table;", $link);

4 Cl4. Close

$li k l ( l$link = mysql connect('mysql server',

'mysql_user',

'mysql_password');

$db_selected = mysql_select_db('foo',

$link);

$result = mysql_query("DELETE FROM table;", $link);

mysql_close($link);

lmysql_query

INSERT, UPDATE, DELETE, DROPReturns true or false

SELECT, SHOW, DESCRIBE, EXPLAIN

R t f l Returns resource on success, false on errorThe returned resource should be The returned resource should be passed to mysql_fetch_array()

R t i i T blRetrieving Table

$li k l t(' l '$link = mysql connect('mysql server',

'mysql_user',

'mysql_password');

$db selected = mysql select db(‘name',$db selected mysql select db( name ,

$link);

$result = mysql_query("SELECT * FROM table;", $link);

while ($row = mysql_fetch_array($result))

{

print($row[0]);

i t($ [1])print($row[1]);

}

mysql close($link);ysq c ose($ );

R t i i T blRetrieving Table

$li k l t(' l '$link = mysql connect('mysql server',

'mysql_user',

'mysql_password');

$db selected = mysql select db(‘name',$db selected mysql select db( name ,

$link);

$result = mysql_query("SELECT * FROM table;", $link);

while ($row = mysql_fetch_array($result))

{

print($row["id"]);

i t($ [" "])print($row["name"]);

}

mysql close($link);ysq c ose($ );