Développer une application avec PHP et MySQL

Dpartement ducation et Technologie

Les formulaires en HTML

JavaScript et CSS

PHP

MySQL

Dmarche de conception

Dvelopper une application avec PHP et MySQL tienne Vandeput

5.87

Juin 2005

Centre pour la Formation l'Informatique dans leSecondaire

Publier sur le Web - Perfectionnement

tienne Vandeput CeFIS 2005 2

Toutes vos remarques pour amliorer ces notes sont les bienvenues. Vous pouvez les envoyer :

[email protected]



Table des matires

1. LES FORMULAIRES EN HTML .......................................................................... 6 1.1 INTRODUCTION ................................................................................................................................................6 1.2 LE FORMULAIRE (ELEMENT FORM)..............................................................................................................6

1.2.1 Attributs importants.....................................................................................................................................................7 1.2.2 Contenu du formulaire ................................................................................................................................................8

1.3 L'ELEMENT TEXTAREA.................................................................................................................................8 1.3.1 Les attributs les plus importants ..................................................................................................................................8

1.4 L'ELEMENT SELECT......................................................................................................................................9 1.4.1 Les attributs les plus importants ..................................................................................................................................9 1.4.2 Les attributs les plus importants de l'lment option.............................................................................................10

1.5 L'ELEMENT INPUT ......................................................................................................................................11 1.5.1 Le champ texte .........................................................................................................................11 1.5.2 Le champ texte spcial mot de passe ...............................................................................11 1.5.3 Le champ texte spcial rfrence de fichier ..............................................................................12 1.5.4 Le bouton simple ..................................................................................................................12 1.5.5 Le bouton radio ......................................................................................................................12 1.5.6 Le bouton d'envoi ................................................................................................................13 1.5.7 Le bouton d'envoi image .......................................................................................................14 1.5.8 Le bouton de rinitialisation ...................................................................................................14 1.5.9 La case cocher ..............................................................................................................15 1.5.10 Le champ cach ..............................................................................................................16

1.6 ATTRIBUTS VS METHODES .............................................................................................................................16 1.7 LA GESTION DES EVENEMENTS ......................................................................................................................17

1.7.1 lment form et transmission des donnes..........................................................................................................17 1.7.2 lment textarea ..................................................................................................................................................19 1.7.3 lment select .....................................................................................................................................................20 1.7.4 lment input ......................................................................................................................................................20

1.8 AUTRES EVENEMENTS, AUTRES ELEMENTS ...................................................................................................20 1.9 EXERCICES.....................................................................................................................................................20

1.9.1 Rendre un champ texte inaccessible..........................................................................................................................21 1.9.2 Donner le focus un lment prcis .........................................................................................................................21 1.9.3 Permettre lexcution dune action en fonction du choix dun bouton radio ............................................................21

1.10 LES STYLES CSS ............................................................................................................................................22 1.10.1 Feuille de styles ....................................................................................................................................................22 1.10.2 Rgle.....................................................................................................................................................................23 1.10.3 Slecteur ...............................................................................................................................................................23 1.10.4 Exemples ..............................................................................................................................................................24



1.10.5 La cascade ............................................................................................................................................................24 1.10.6 Exercice ................................................................................................................................................................25 1.10.7 Localisation des feuilles de styles ........................................................................................................................26

1.11 LES FORMULAIRES ET JAVASCRIPT ...............................................................................................................27 1.11.1 Scripts gnraux ...................................................................................................................................................27 1.11.2 Scripts lis aux formulaires ..................................................................................................................................30

1.12 EXERCICE.......................................................................................................................................................35

2. LE LANGAGE PHP ............................................................................................... 36 2.1 EN QUOI CONSISTE PHP ? ..............................................................................................................................36 2.2 QUOFFRE PHP? ............................................................................................................................................37 2.3 LES BASES DU LANGAGE................................................................................................................................38

2.3.1 lments de syntaxe ..................................................................................................................................................38 2.3.2 Variables ...................................................................................................................................................................39 2.3.3 Les constantes ...........................................................................................................................................................44 2.3.4 Types.........................................................................................................................................................................44 2.3.5 Oprateurs .................................................................................................................................................................47 2.3.6 Fonctions ...................................................................................................................................................................48 2.3.7 Expressions ...............................................................................................................................................................49 2.3.8 Instructions de contrle .............................................................................................................................................49

2.4 EXERCICE.......................................................................................................................................................51 2.5 LES TABLEAUX EN PHP .................................................................................................................................54

2.5.1 Crer un tableau ........................................................................................................................................................54 2.5.2 Fonctions lies aux tableaux......................................................................................................................................54

2.6 LES SESSIONS .................................................................................................................................................55 2.6.1 Cration dun nouvel utilisateur ................................................................................................................................55 2.6.2 Authentification dun utilisateur ...............................................................................................................................55 2.6.3 Identificateur de session ............................................................................................................................................55

2.7 LES INCLUSIONS DE FICHIERS ........................................................................................................................56 2.8 EXERCICE.......................................................................................................................................................58

3. MYSQL .................................................................................................................... 59 3.1 L'ASSOCIATION ENTRE MYSQL ET PHP........................................................................................................59 3.2 LA CONCEPTION D'UNE BASE DE DONNEES....................................................................................................60

3.2.1 Schmas ERA............................................................................................................................................................60 3.2.2 Entits, associations, attributs, rles et cardinalits...................................................................................................60 3.2.3 Transformation en tables...........................................................................................................................................61 3.2.4 Associations ternaires................................................................................................................................................62 3.2.5 Cls trangres ..........................................................................................................................................................62

3.3 LES TABLES ET LEURS CONTENUS..................................................................................................................63



3.3.1 Structure d'une table..................................................................................................................................................63 3.3.2 Types d'informations.................................................................................................................................................63

3.4 LES PRIMITIVES DE GESTION D'UNE BASE DE DONNEES.................................................................................65 3.4.1 Accs une BD et ses tables ..................................................................................................................................65 3.4.2 Cration et gestion du contenu d'une BD ..................................................................................................................66 3.4.3 Gestion d'une BD avec PHPMyAdmin .....................................................................................................................74 3.4.4 Slection d'informations dans une BD ......................................................................................................................75 3.4.5 Slections multi-tables ..............................................................................................................................................79

3.5 GERER UNE BD AVEC PHP ............................................................................................................................85 3.5.1 Le principe de communication ..................................................................................................................................85 3.5.2 Les fonctions PHP.....................................................................................................................................................85

3.6 BILAN.............................................................................................................................................................90 3.7 EXERCICE.......................................................................................................................................................90

4. APPLICATION....................................................................................................... 91 4.1 INTRODUCTION ..............................................................................................................................................91 4.2 UN ENONCE A RAFFINER ................................................................................................................................91 4.3 UN BON SCHEMA CONCEPTUEL......................................................................................................................92

4.3.1 Premire bauche ......................................................................................................................................................92 4.3.2 Amliorations du schma ..........................................................................................................................................93

4.4 LE SCHEMA LOGIQUE.....................................................................................................................................94 4.5 LA CONSTRUCTION D'UNE INTERFACE...........................................................................................................95

4.5.1 Utilit ........................................................................................................................................................................95 4.5.2 Utilisabilit................................................................................................................................................................96 4.5.3 Cration de modles ..................................................................................................................................................96 4.5.4 La connexion...........................................................................................................................................................105 4.5.5 Les scripts................................................................................................................................................................109

4.6 LA BASE DE DONNEES..................................................................................................................................126 4.6.1 La table eleve ..........................................................................................................................................................126 4.6.2 La table maitre.........................................................................................................................................................127 4.6.3 La table lieu.............................................................................................................................................................127 4.6.4 La table stage...........................................................................................................................................................128

4.7 STRUCTURE DU SITE ....................................................................................................................................128



1. Les formulaires en HTML 1.1 Introduction Depuis ses premiers dveloppements, HTML inclut des lments1 qui permettent la communication entre un client Web et un serveur capable de recevoir des informations de ce client, de les stocker et/ou d'effectuer des traitements en dpendant. La ralisation de sites Web interactifs et la cration de pages Web dynamiques demandent que cette communication soit possible. Ds lors, la connaissance de ces lments est dterminante car ils constituent, en quelque sorte, l'interface de communication entre l'internaute et les applications qui sont dveloppes sur des serveurs.

Dans ce chapitre, nous nous intresserons chacun de ces lments, leurs attributs possibles, mais aussi aux informations qui vont tre vhicules vers un serveur ainsi qu' leur forme.

Les applications ct serveur sont dveloppes dans un langage qualifi de langage de script. PHP est le langage de script que nous avons choisi2 pour illustrer le mcanisme de construction dynamique des pages Web. Le langage est capable de communiquer et d'exploiter des donnes gres par de nombreux SGBD3. Nous nous intresserons des applications exploitant des bases de donnes gres par le SGBD MySQL parce que la combinaison de ces deux outils (langage de script et SGBD) semble aujourd'hui la plus frquente parmi les nombreuses combinaisons possibles. C'est aussi celle qui apparat comme la mieux adapte aux applications exploitant Internet et ses technologies. Les bases de donnes gres via des sites Web sont gnralement particulires et comprennent peu d'enregistrements par rapports certains autres types d'application. MySQL est adapt ce type de bases de donnes en ce sens qu'il offre juste les services qu'il faut, avec l'efficacit souhaite.

Une observation importante : le fait de confier l'excution de scripts des serveurs n'exclut pas la possibilit, pour le client, d'excuter des scripts localement. C'est le cas, par exemple, lorsqu'on souhaite faire valider les donnes avant de les envoyer. Les traitements seront donc parfois rpartis entre le client et le serveur mme si l'objet de cet ouvrage est de s'intresser aux scripts ct serveur.

1.2 Le formulaire (lment form) Le formulaire est un lment qui rend possible la fourniture d'un certain nombre de donnes et l'excution d'une action par un serveur. Un simple exemple, pour avoir accs certains services sur le Web (commande en ligne, cours en ligne, homebanking,) vous devez gnralement fournir un identificateur (login) et un mot de passe (password). La fourniture de ces informations se fait au travers d'un formulaire (zones complter).

En fonction des donnes reues, l'application construit dynamiquement une page Web dpendant des donnes reues. Dans ce cas, il sagit dune page personnalise (voir ci-aprs). 1 p, h1, a, form sont des lments au sens de HTML. 2 En ce qui concerne les langages de script, le dveloppeur a le choix. Ce sont cependant les langages utilisables gratuitement et pouvant tre distribus qui connaissent le plus grand succs. Parmi eux, PHP, Python et dans une moindre mesure Perl semblent les mieux placs dans le hit parade des dveloppeurs. 3 Systme de Gestion de Bases de Donnes



En HTML, le formulaire correspond l'lment form. Cet lment contient gnralement plusieurs lments interactifs que nous allons dcrire par la suite (champs de texte, boutons, cases cocher,). Ces lments interactifs permettent d'encoder ou de slectionner les donnes transmettre au serveur. Comme nous le verrons, il peut galement contenir des lments cachs qui sont aussi des donnes transmettre au serveur.

Un document HTML peut contenir plusieurs formulaires4 mais ceux-ci ne peuvent pas tre imbriqus.

1.2.1 Attributs importants

1.2.1.1 action Cet attribut est obligatoire. Sa valeur est une URL5 (adresse absolue ou relative) qui prcise le script qui doit recevoir les donnes et tre excut sur le serveur. En gnral, le script a pour but de crer une page HTML qui sera renvoye au client Web.

1.2.1.2 method Il n'y a que deux valeurs possibles: get ou post. La mthode get concatne les donnes la fin de l'URL du script alors que la mthode post envoie les donnes dans le corps de requte.

La mthode post est prfrable pour tout une srie de raisons et notamment, la confidentialit.

1.2.1.3 name Cet attribut permet de nommer le formulaire. Il n'est d'aucune utilit pour le serveur mais peut servir un script local.

4 Encore faut-il trouver une illustration intressante de cette possibilit 5 Beaucoup de serveurs sont sensibles la casse des noms de fichiers et de dossiers. Il convient donc d'tre prudent dans l'criture de l'URL. Nous verrons galement qu'une URL vide a du sens dans certaines circonstances.



Dans l'illustration qui prcde, on voit le code engendr par Macromedia Dreamweaver MX lors de l'insertion d'un formulaire dans un document HTML. Un nom par dfaut est donn et l'action par dfaut est vide. La mthode choisie est post.

1.2.2 Contenu du formulaire Tous ces attributs n'ont aucun sens si le formulaire n'a pas de contenu. L'lment form est donc un lment qui va en contenir d'autres porteurs d'informations ou d'instructions.

On trouve trois types d'lments dans un formulaire:

textarea: pour dfinir une zone de texte

select: pour slectionner une information dans une liste

input: pour tous les autres types d'entres Ce sont ces lments que nous allons dcrire maintenant.

1.3 L'lment textarea On emploie cet lment lorsqu'il y a plusieurs lignes de texte entrer. Ainsi, lorsqu'on souhaite raliser une application de Webmail, il est clair que la zone de rdaction du message doit s'tendre sur plusieurs lignes. Les valeurs par dfaut sont 4 lignes de 40 caractres. Les attributs qui suivent permettent nanmoins de modifier ces valeurs.

Cet lment ncessite une balise initiale et une balise finale. Un texte par dfaut peut se trouver entre ces deux balises. Il est noter que le texte n'est pas limit dans sa taille, ce qui peut se rvler assez gnant dans une perspective de stockage dans une base de donnes, par exemple. Un contrle peut toutefois tre effectu, soit par un script local, soit par un script PHP au niveau du serveur.

1.3.1 Les attributs les plus importants

1.3.1.1 name La zone de texte doit porter un nom si on veut l'exploiter en PHP. Ce nom correspondra au nom d'une variable en PHP. C'est le moment de se souvenir que le langage est sensible la casse.

Si certains objets interactifs portent le mme nom, PHP ne prend en compte que le dernier. Les noms doivent commencer par une lettre ou le caractre _ suivi de lettres, chiffres ou caractres _.

1.3.1.2 rows Cet attribut prcise la hauteur de la zone de texte, ce qui n'en limite pas la taille.



1.3.1.3 cols Cet attribut spcifie le nombre de colonnes visibles mais ne correspond que fort approximativement au nombre de caractres.

Voici un exemple de code et de son interprtation dans un navigateur.

Objectifs

du cours

1.4 L'lment select Cet lment dfini un menu droulant dans lequel l'utilisateur va pouvoir slectionner une ou plusieurs informations. Ces informations seront dfinies grce des lments option qui seront inclus entre les deux balises de l'lment select.

Notez que chacun des lments dcrits jusqu'ici peut tre vu comme un bloc contenant ventuellement d'autres blocs. L'lment form contient des lments textarea, select, L'lment (bloc) select contient des lments option.

Un formulaire peut videmment contenir plusieurs lments select. PHP cre une variable ou un tableau (en cas de slection multiple) pour chaque lment select. La variable ou le tableau porte le mme nom que l'lment.

1.4.1 Les attributs les plus importants

1.4.1.1 name Pour les raisons qui prcdent, cet attribut est videmment indispensable. Attention, en cas de slection multiple possible, ce nom doit se terminer par des crochets ([]).

1.4.1.2 multiple Cet attribut autorise les slections multiples dans la liste.

form

select

option

textarea



1.4.1.3 size Cet attribut spcifie le nombre d'items visibles de la liste. En son absence, un seul item est visible.

1.4.2 Les attributs les plus importants de l'lment option Cet lment n'est pas directement un objet de formulaire mais une composante de l'lment select. Il ncessite une balise initiale et une balise finale.

1.4.2.1 value L'attribut prcise la valeur qui est envoye au script et donc pas ncessairement celle qui est affiche dans la liste. Il est en effet plus simple, parfois, d'envoyer des valeurs techniques plus simples manipuler tout en affichant des choix comprhensibles.

1.4.2.2 selected Les options qui ont cet attribut correspondent des valeurs prslectionnes. Il n'est pas ncessaire qu'il y en ait. Dans le cas d'une slection simple, s'il y en a plusieurs, seule la dernire est prise en compte. Lorsque la liste est droulante, c'est la premire option ou, le cas chant, l'option prslectionne qui apparat. Voici deux exemples incluant les types d'lments concerns. Type

de cours

inconnu

prsenciel

distance

semi-prsenciel

Type

de cours

inconnu

prsenciel

distance

semi-prsenciel



1.5 L'lment input Cet lment correspond une panoplie d'objets de formulaire. C'est l'attribut type de cet lment input qui les distingue. Nous allons donc examiner ces diffrents objets, les uns aprs les autres. Un formulaire peut videment contenir plusieurs lments input. L'lment input n'a qu'une seule balise.

1.5.1 Le champ texte Cet attribut dfinit un champ texte d'une seule ligne. PHP cre une variable portant le nom du champ dont la valeur est l'information que ce dernier contient. Les attributs courants sont:

1.5.1.1 name voir ci-dessus

1.5.1.2 value la valeur par dfaut du champ texte

1.5.1.3 size la taille (approximative) d'affichage du champ texte

1.5.1.4 maxlength le nombre de caractres admis

1.5.1.5 accesskey cre un raccourci-clavier pour accder directement au champ

Voici un petit exemple. Dnomination

Le raccourci-clavier alt-D premettra d'accder directement au champ texte. L'attribut accesskey existe aussi pour les lments textarea et select.

1.5.2 Le champ texte spcial mot de passe L'attribut dfinit un champ texte particulier car l'information introduite dans ce champ n'est pas lisible l'cran. Il faut toutefois savoir que le mot de passe est transmis en clair au serveur. Il est possible de demander PHP un encryptage par la suite.

Comme pour un champ texte ordinaire, PHP cre une variable portant le nom du champ. Les attributs courants sont les mmes que ceux du champ texte normal.



1.5.3 Le champ texte spcial rfrence de fichier Dans ce champ texte particulier, l'information est la rfrence absolue et locale d'un fichier que l'on veut transfrer au serveur. L'usage de cette fonctionnalit ncessite que la mthode d'envoi du formulaire soit post et que l'attribut enctype, dont nous navons pas parl, soit prsent avec comme valeur multipart/form-data. Le champ est accompagn d'un bouton Parcourir qui ouvre une fentre de l'explorateur. Tlverser

Les attributs courants sont sensiblement les mmes, si ce n'est que l'attribut value n'est pas utilis.

1.5.4 Le bouton simple L'attribut dfinit un bouton simple. L'intrt de ce type de bouton rside dans l'excution de scripts locaux. Aucune donne n'est envoye au serveur lorsqu'un tel bouton est activ. On mentionnera les attributs:

1.5.4.1 name le nom du bouton

1.5.4.2 value son tiquette

1.5.4.3 disabled son tat (dsactiv)

1.5.4.4 accesskey cre un raccourci-clavier pour accder directement au bouton

1.5.5 Le bouton radio Les boutons radio sont utiliss en groupe. Un seul d'entre eux peut tre actif la fois. Le groupe de boutons porte un nom qui sera celui de la variable PHP contenant la valeur du bouton slectionn. Citons comme attributs:

1.5.5.1 name le nom du groupe de boutons



1.5.5.2 value la valeur du bouton (information transmise)

1.5.5.3 checked la slection du bouton

1.5.5.4 accesskey le raccourci-clavier

Un exemple: Type

d'enseignement

Gnral

Technique

Professionnel

1.5.6 Le bouton d'envoi Grce cet attribut, le bouton est le dclencheur de l'envoi des donnes au script dcrit dans l'attribut action de l'lment form. Un formulaire peut contenir plusieurs boutons d'envoi. Dans ce cas, c'est au script de choisir le traitement effectuer en fonction de la valeur du bouton. Comme d'habitude, PHP crera une variable portant le nom de ce bouton. Les attributs importants sont:

1.5.6.1 name le nom du bouton ncessaire pour la cration de la variable

1.5.6.2 value la valeur du bouton ncessaire pour un ventuel choix de script

1.5.6.3 accesskey un caractre pour un raccourci-clavier d'accs rapide au bouton



1.5.7 Le bouton d'envoi image Le bouton d'envoi image joue le mme rle que le bouton d'envoi classique. La diffrence rside dans le fait que la source de l'image doit tre fournie. De plus, les coordonnes prcises de l'endroit o l'on a cliqu sont galement envoyes. Les noms des deux variables sont constitus du nom du bouton suivi respectivement des symboles _x et _y. Les attributs retenir sont:

1.5.7.1 name le nom du bouton image

1.5.7.2 src la localisation de l'image

1.5.7.3 alt le texte alternatif (si l'image ne peut tre affiche)

1.5.7.4 accesskey le caractre pour un raccourci-clavier ventuel d'accs au bouton

1.5.8 Le bouton de rinitialisation Le bouton de rinitialisation permet chaque objet du formulaire de reprendre sa valeur initiale. Il n'y a donc aucune information envoye au serveur lorsque celui-ci est activ. Les attributs essentiels sont:

1.5.8.1 name le nom du bouton

1.5.8.2 value son tiquette

1.5.8.3 accesskey le caractre pour un raccourci-clavier



1.5.9 La case cocher L'attribut fait de cet objet une case cocher. Il est possible mais pas ncessaire de grouper les cases cocher. PHP cre une variable pour chaque case cocher ou un tableau pour un groupe de cases cocher. La case ou au moins une des cases dans le cas d'un groupe doit tre coche pour que la variable ou le tableau soit cr. La programmation devra veiller s'assurer qu'une telle variable ou un tel tableau existe. Les attributs importants sont:

1.5.9.1 name le nom de la case sera celui de la variable; dans le cas d'un groupement, il faut donner le mme nom chaque case et faire suivre ce nom de crochets ([]).

1.5.9.2 value la valeur transmise au script qui ne correspond pas l'affichage

1.5.9.3 checked pour signaler si la case et coche

1.5.9.4 accesskey un caractre pour le raccourci-clavier Cours

choisis

Math

Franais

Physique

Histoire



1.5.10 Le champ cach L'attribut confre ici au champ le statut cach. L'intrt rside dans la possibilit de transmettre au serveur des valeurs qui seraient disponibles au niveau du navigateur. Cest aussi de pallier le caractre sans tat de http. Une variable portant le nom du champ est cre. Les attributs sont:

1.5.10.1 name le nom du champ cach

1.5.10.2 value la valeur transmettre

1.6 Attributs vs mthodes Sans entrer dans le grand dtail, nous rappellerons que JavaScript est un langage de script interprt par le client (le navigateur Web) et que ce langage est un langage orient objet 6. Il sappuie sur le Document Object Model (DOM) dvelopp par le consortium w37. Parmi ces objets , on trouve bien sr les formulaires et tous les objets quils peuvent eux-mmes contenir. JavaScript dfinit des mthodes quil est possible dinvoquer sur ces objets. Nous nous intresserons peu ces mthodes tant donn que la programmation en JavaScript nest pas le sujet principal de cet ouvrage. En revanche, nous avons besoin des proprits et des vnements dtectables au niveau des objets car ils se traduisent en attributs des lments correspondants. titre dexemple, voici pour un formulaire quelques attributs et mthodes disponibles.

Quelques attributs possibles de llment formulaire (du point de vue HTML)

Proprits : name : le nom du formulaire action : ladresse du script de serveur excuter method : la mthode d'appel du script (get ou post)

vnements : onSubmit : pour dtecter la soumission du formulaire onReset : pour dtecter la rinitialisation

Il en existe bien dautres qui sont moins spcifiques (id, class, pour les proprits ; onclick, ondblclick, pour les vnements). Quelques mthodes possibles de lobjet formulaire8 (du point de vue JavaScript) :

submit : pour dclencher l'action du formulaire reset : pour rinitialiser les donnes du formulaire avec les valeurs par dfaut

6 La signification de ce qualificatif, en particulier en JavaScript, mriterait un large dbat que nous ne mneront pas. 7 http://w3.org 8 On pourrait trouver dans un script une instruction du genre if (valide) form.submit() ; pour autant que valide dsigne une variable boolenne et form un formulaire.



Aprs avoir illustr les proprits des lments correspondant aux objets de formulaire, nous consacrons la section suivante examiner les vnements qui peuvent galement y tre associs sous forme dattributs.

1.7 La gestion des vnements Les attributs correspondant des vnements peuvent se rvler utiles dans le contexte d'utilisation de scripts locaux. En voici une description en fonction des lments concerns.

1.7.1 lment form et transmission des donnes

1.7.1.1 onsubmit Cet attribut indique un script excuter localement avant l'envoi des donnes (par exemple, un certain nombre de vrifications). Ce script doit renvoyer une valeur boolenne qui dtermine l'envoi ou non des donnes. Il est dclench lorsque l'utilisateur clique sur le bouton d'envoi (voir plus loin).

La valeur doit tre constitue du mot return suivi du nom du script excuter. Exemple: onsubmit = "return verification()"

Le script doit figurer dans le document, soit dans la partie entte, soit dans la partie corps, en tant que contenu de llment script. Cet lment possde un attribut language qui prcise dans quel langage le script est rdig (autrement dit, comment il doit tre interprt) et un attribut type qui prcise quel encodage est utilis.

function verification(){

if(document.forms["formulaire"].elements["denomination"].value==""){

alert("Vous n'avez pas fourni de dnomination pour le cours");

return false;

}

if(document.forms["formulaire"].elements["objectifs"].value==""){

alert("Vous n'avez pas fourni d'objectifs pour le cours");

return false;

} else{

return true;

}

}

Comme nous ne donnons pas trop de dtails propos de JavaScript, nous apportons ce script quelques commentaires.

Il se compose dun double test de vrification de remplissage pour les rubriques Dnomination et Objectifs. La fonction na pas dargument et renvoie une valeur boolenne (return=). alert() est une fonction prdfinie qui affiche une bote de dialogue davertissement. Elle prend comme argument une chane de caractre. Notez que JavaScript est un langage faiblement typ. Le typage des valeurs et des variables est implicite. Observez aussi la syntaxe dcriture pour une structure alternative.



Le point le plus dlicat concerne laccs aux informations de la page. JavaScript utilise le modle objet du document (DOM) pour accder ces informations. Lobjet principal est document. Il contient un tableau index forms de ses (ventuels) formulaires. Chaque formulaire contient un tableau index de ses lments : elements. Pour accder la valeur dun de ces lments, on utilise la proprit value. Notez encore le symbole de comparaison (== et non =). Il est possible daccder litem dun tableau en fournissant son numro dordre en commenant par 0 (exemple : si formulaire est le seul formulaire, forms[0]).

Voici maintenant le code du fichier test.php. Ce dernier contient laction effectuer si la valeur renvoye par le script est true savoir, laffichage dun message de russite et des donnes transmises. Pour ce faire, des commandes lmentaires en PHP sont ncessaires. Une feuille de style, cefis.css, est attache la page test.php.

Fourniture de donnes un serveur

Excution du code JavaScript

Test concluant!

Les donnes suivantes ont t envoyes:

Dnomination du cours

Objectifs du cours



Cet exemple nous permet de dcouvrir un tout petit peu PHP. Lorsque le navigateur rencontre la suite des symboles . Comme vous vous en doutez9, la commande echo est une commande daffichage.

Une autre chose importante observer, cest que ( partir de sa version 4) PHP cre une variable prdfinie10 sous forme dun tableau sappelant $_POST11 et contenant les valeurs transmises au serveur par la mthode post. On accde une composante du tableau par son numro dordre ou le nom (attribut name) de llment contenant linformation concerne.

1.7.1.2 onreset Cet attribut indique un script excuter localement avant la rinitialisation du formulaire. Pour la valeur de cet attribut, la syntaxe est identique celle de l'attribut onsubmit.

1.7.2 lment textarea Voici quelques-uns des vnements (ou attributs de script) de llment textarea.

1.7.2.1 onfocus Le script associ sera excut lorsque la zone de texte recevra le focus12.

9 Rappelez-vous la cration de fichiers batch en DOS. 10 Il en cre plein dautres. 11 En PHP, toutes les variables ont un nom commenant par le symbole $. 12 Un objet reoit le focus quand lutilisateur clique dessus, ou bien quil y accde par la touche de tabulation ou un raccourci-clavier.



1.7.2.2 onblur Il sagit ici de la perte du focus par llment.

1.7.2.3 onselect Cet vnement se produit si tout ou partie du texte de la zone a t slectionn.

1.7.2.4 onchange Celui-ci se produit en cas de perte de focus et pour autant que la valeur de la zone de texte ait t modifie.

1.7.3 lment select Parmi les vnements associables llment select on trouve onfocus, onblur et onchange.

1.7.4 lment input

1.7.4.1 Champs texte, texte spcial mot de passe et texte spcial rfrence de fichier Les vnements intressants associer sont onfocus, onblur, onselect et onchange.

1.7.4.2 Bouton simple, denvoi,de rinitialisation, radio, case cocher Les vnements associer sont onfocus, onblur et onchange.

1.7.4.3 Bouton denvoi image Les vnements associer sont onfocus et onblur.

1.8 Autres vnements, autres lments Si vous utilisez un diteur spcialis, vous constaterez peut-tre quil propose beaucoup dautres vnements et quelques objets de formulaire supplmentaires.

Parmi les vnements, citons, par exemple : onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmouseout, onmousemove, onkeypress, onkeydown, onkeyup Les lments button, fieldset, label et optgroup existent galement. Ils offrent de nouvelles possibilits mais ils ne sont pas correctement interprts par tous les navigateurs.

Par exemple, llment button permet de combiner texte et image. Llment fieldset permet de regrouper des champs sous un mme titre, grce un lment legend par lequel llment fieldset doit commencer. Llment label permet dattribuer une tiquette un objet, ce qui na de vritable intrt que pour les personnes malvoyantes utilisant des navigateurs coupls avec un systme sonore. Llment optgroup sert regrouper des lments options lintrieur dun lment select ce qui permet la cration de menus en cascade.

1.9 Exercices crire des scripts JavaScript pour :

rendre un champ texte inaccessible

donner le focus un lment prcis

permettre lexcution dune action en fonction du choix dun bouton radio



1.9.1 Rendre un champ texte inaccessible Il suffit de faire perdre le focus lobjet au moment o il la reoit.

Comme dans la plupart des langages objets, la rfrence lobjet courant est this.

Une autre solution consiste donner lobjet lattribut readonly.

Les effets graphiques sont lgrement diffrents dans la mesure o, dans le premier cas, le point dinsertion apparat avant de disparatre.

1.9.2 Donner le focus un lment prcis Cette action est ralise au chargement de la page. Cest donc lattribut onload de llment body qui est utilis.

Nom

1.9.3 Permettre lexcution dune action en fonction du choix dun bouton radio Le problme est plus dlicat. Il sagit didentifier le bouton radio qui est slectionn et de complter laction en consquence.

La premire fonction a pour but de renvoyer lindex correspondant ce bouton dans le tableau des boutons radios concerns (index qui commence 0). La seconde fonction fixe laction qui est la valeur du bouton et provoque la soumission du formulaire.

function valeurChoix(groupeBouton){

for (var i=0;i



Choix du script

action n1

action n2

action n3

Voici quoi ressemble linterface. Le choix dun des boutons avant un clic sur le bouton simple permet de slectionner le script dont lexcution sera demande au serveur.

1.10 Les styles CSS Cette section, un peu hors contexte, trouve toutefois son utilit dans la mesure o elle prsente un langage (un de plus) interprt par les navigateurs.

CSS signifie Cascading Style Sheets (feuilles de style en cascade). Cest un langage dont lobjectif est de paramtrer finement la mise en page et la mise en forme des lments dun document HTML. Il convient den comprendre les principes, et notamment, le fonctionnement de la cascade. Il est galement utile de se familiariser avec la syntaxe du langage.

Lutilisation de CSS permet de rflchir des stratgies efficaces de conception en prenant en compte, ds le dpart, les possibles mises jour.

1.10.1 Feuille de styles Le concept de feuille de styles est un concept abstrait qui trouve sa concrtisation sous de multiples formes. On peut dfinir une feuille de styles comme un ensemble de rgles utilises par le navigateur pour la mise en page et en forme des diffrents lments (au sens de HTML). Ces rgles sont dfinies:

par dfaut



par l'internaute

par l'auteur Nous verrons plus loin quelles priorits le navigateur accorde ces diffrents niveaux.

1.10.2 Rgle Une rgle se compose dun slecteur (d'lments) suivi dune dclaration (des paramtres appliquer). La syntaxe en est la suivante :

{} Examinons dabord la syntaxe dune dclaration. Elle se compose dun ou plusieurs ensembles constitus dun mot-cl et dune valeur.

: ; [ : ;]*

Il existe 52 mots-cls dans la version CSS1 que sont censs respecter tous les navigateurs. Chaque mot-cl est spar de sa valeur par un double point et lensemble se termine par un point-virgule. Toutes les valeurs ne sont pas acceptables.

1.10.2.1 Exemples color : red ;

color : #FF0000 ;

font-family : Arial ;

color : red; font-size : 18px ;

1.10.3 Slecteur Les slecteurs sont les paramtres qui autorisent le navigateur slectionner les rgles de mise en forme applicables aux lments HTML. On distingue les slecteurs simples des slecteurs contextuels.

1.10.3.1 Slecteur simple Un slecteur simple permet de slectionner les lments de trois manires. Soit :

quils portent le mme nom ;

quils ont les mmes valeurs pour certains attributs prcis (class et id) ;

quils portent le mme nom et ont les mmes valeurs pour certains attributs prcis (class ou id)

1.10.3.2 Exemples Mme nom : p

Tous les lments p du document HTML tels , , ,

Mme valeur pour lattribut class : .important (attention au point initial)

Tous lments (quel que soit leur nom) qui ont un attribut class valant "important" tels :



Tous les lments p (td) qui ont un attribut class (id) valant "important" ("titre")

, ,

1.10.3.3 Slecteur contextuel Les slecteurs contextuels permettent de slectionner tous les lments qui sont dans un certain contexte. La syntaxe est relativement simple puisquun slecteur contextuel se compose de plusieurs slecteurs simples spars par des espaces.

Il est bon, pour en comprendre lintrt, de prendre en compte le principe d'embotement des lments HTML. Les lments HTML sont embots. Cela signifie quils peuvent contenir dautres lments (p, h1, strong, ul,). Un slecteur contextuel fait rfrence un lment contenu dans un ou plusieurs autres.

La possibilit dutiliser des slecteurs contextuels donne une grande souplesse la mise en forme. Ainsi, par exemple, les paragraphes peuvent-ils tre formats diffremment sils sont dans un tableau, dans un calques ou hors de tout contexte.

1.10.3.4 Exemples h4 strong dsigne les lments strong qui sont contenus dans un lment h4. Titre en gras

Autres exemples : h4 strong em ou encore td .important

Attention, p.important (slecteur simple) est diffrent de p .important (slecteur contextuel).

1.10.4 Exemples Voici quelques exemples de rgles. Notez que ces rgles ne sont que du texte et quelles peuvent donc tre dites avec un simple diteur de texte. Il reste savoir quel endroit on peut les dfinir.

p {color:red;} les contenus des paragraphes en rouge

h1 {font-size:20px;font-family:Verdana;} les titres de niveau 1 en taille 20 pixels et police Verdana

p.important {font-weight:bold;} les paragraphes qualifis "important" en gras

div p,h1,.important {color:red;}

les paragraphes dans les calques, les titres de niveau 1 et tous les lments qualifis "important" en rouge

td p.mineur {color=#333333;font-size:15px;} les paragraphes qualifis "mineur" dans les cellules de tableau en gris et taille 15 pixels

Il faut signaler que la plupart des diteurs HTML donnent au concepteur la possibilit de crer les rgles de manire dynamique sans avoir en crire le code.

1.10.5 La cascade Rappelons que la feuille de style se compose tant des rgles dfinies au niveau du navigateur (feuille de style par dfaut) que de celles qui pourraient rsulter du choix de linternaute (prfrences au niveau du navigateur) et, videmment, de celles du concepteur de la page.



Dautre part, une rgle est souvent partielle. Elle ne dfinit pas tous les paramtres des lments considrs. Pour tablir lensemble des paramtres, le navigateur doit tenir compte dune certaine hirarchie.

Enfin, comme les rgles peuvent tre dfinies plusieurs endroits, il convient de dterminer, en cas de rgles concernant les mmes lments, quelle est celle qui doit lemporter. Nous verrons que dans ce cas, cest la proximit de la dfinition par rapport llment qui compte.

1.10.5.1 Algorithme Pour comprendre lalgorithme, il faut se rappeler que les lments HTML sont embots (llment qui contient tous les autres tant html).

Rechercher toutes les dclarations qui concernent l'lment ou la proprit concerne S'il n'y en a pas, prendre en considration les dclarations hrites (embotement) S'il n'y en a toujours pas, prendre en considration les valeurs par dfaut

Trier les dclarations par poids explicites (certaines rgles peuvent tre dclares prioritaires par le concepteur ou linternaute)

Trier par origine (auteur, internaute, agent)

Trier par spcificit du slecteur Ce dernier point mrite une explication. Il sagit de calculer le poids des rgles quil nest pas encore possible de trier, de la manire qui suit.

Il sagit de concatner les trois nombres suivants :

le nombre d'attributs id dans le slecteur (ex: 1)

le nombre d'attributs class dans le slecteur (ex: 1)

le nombre dlments (ex: 3) Dans notre exemple, le poids est 113. Cest la rgle qui a le poids le plus lev qui lemporte.

1.10.6 Exercice

1.10.6.1 nonc Si toutes les dclarations qui suivent sont valables pour un mme lment li, quel sera le slecteur dont la dclaration sera retenue?

ol ul li.rouge {}

ul li {}

li {}

ol ul li {}

#titre {}

li.rouge {} Imaginez une partie de la syntaxe de cet lment et ses embotements pour que cette situation soit plausible.

1.10.6.2 Correction ol ul li.rouge {} 013



ul li {} 002

li {} 001

ol ul li {} 003

#titre {} 100 li.rouge {} 011

Cest donc la dfinition de #titre qui sera prise en compte. Cest assez logique si on se dit quil sagit dun lment trs particulier puisquil est appel titre.

Voici une structure qui rend toutes ces dfinitions plausibles.

1.10.7 Localisation des feuilles de styles Les rgles dune feuille de styles peuvent se retrouver plusieurs endroits :

dans un fichier externe

dans lentte du document HTML

dans la balise douverture dun lment

dans les paramtres du navigateur

1.10.7.1 Fichier externe Il est possible, et cest mme la meilleure des solutions, de rassembler les rgles dans un fichier texte qui sera tlcharg. La liaison entre le document HTML et le fichier feuille de style se fait par lintermdiaire de llment link.

Lattribut rel dcrit le type de relation entre les fichiers. Lattribut href prcise la localisation du fichier. Lattribut type dcrit le type de fichier au navigateur.

1.10.7.2 Entte du document HTML Des rgles peuvent galement tre incluses l'intrieur de l'lment style de lentte. La syntaxe des rgles est rigoureusement la mme.



Les balises de commentaires sont ignores par les navigateurs sils sont capables dinterprter le langage CSS.

1.10.7.3 lment La seule possibilit ce niveau est dutiliser un attribut. Il sagit de lattribut style dont la valeur est la rgle prendre en compte. La syntaxe est lgrement diffrente (pas de slecteur videmment et pas daccolades).

Rappelons que la priorit est accorde aux paramtres qui sont les plus proches de llment. Cette dernire technique est donc une faon de revoir, en dernire minute, le style dun lment. Il nest pas dit que cest une manire efficace de procder.

1.11 Les formulaires et JavaScript Lintrt dun langage de script ct client est vident :

il permet une certaine interactivit ;

il autorise un certain contrle des interactions qui serait trop lourd demander un serveur. Dans cette section, nous prsentons et commentons certains scripts. La plupart sont lis la gestion des formulaires. Le but est de montrer comment fonctionnent le modle objet et le modle des vnements en JavaScript et de faire percevoir qu peu prs tout est permis en matire dinteraction. Beaucoup de ces scripts sont des classiques que lon retrouvera sous dautres formes sur des sites Web.

1.11.1 Scripts gnraux Nous avons dj proposs des scripts titre dexercices. En voici dautres. Certains illustrent la communication possible entre les langages et en particulier, entre JavaScript et PHP.

1.11.1.1 Faire afficher la date et lheure Cet exemple illustre la possibilit de crer un objet de type Date et den extraire les informations. Un objet est cr en utilisant le mot-cl new. Diverses mthodes peuvent tre invoques sur des objets de type Date : getDate(), getMonth(),

Notez que getDate() renvoie un nombre entre 1 et 31 alors que getDay() renverrait un nombre entre 0 et 6 correspondant au jour de la semaine.

1.11.1.2 Faire afficher la date du serveur Cet exemple illustre le passage dun langage lautre. Nous utilisons ici la mthode write() de lobjet document. Le mini script PHP fournira la date du serveur sous forme dune chane de caractres.



Cette dernire sera concatne un bout de phrase par JavaScript (oprateur + pour la concatnation). Notez que date() est une fonction PHP13.

Le fichier qui contiendra ce script devra avoir lextension php.

1.11.1.3 Faire afficher la date de dernire modification du document On sintresse ici la proprit lastModified de lobjet document. Le rsultat (une chane de caractres) est ensuite dcoup en morceaux pour reconstituer la date sous un format europen.

La mthode charAt() sapplique tous les objets chanes de caractres et renvoie le caractre la position indique par largument (lindex commence 0 comme dhabitude). Une autre possibilit est dutiliser la mthode substring().

On observe aussi que JavaScript peut produire des balises (exemple ici : ) qui seront interprtes par le navigateur.

1.11.1.4 Recommander un site un(e) ami(e) Il sagit dun script simple mais qui montre la souplesse dun langage comme JavaScript. Les variables email, sujet et message correspondent des chanes de caractres. La proprit location de lobjet window sert rediriger la fentre vers une nouvelle adresse (URL). Autrement dit, le navigateur fera appel au client mail en fournissant le destinataire (adresse), le sujet (sujet) et le corps du message (message). Ladresse est fournie par linternaute travers une bote de dialogue (fonction prompt()).



}

-->

Un seul bouton est ncessaire pour le dclenchement de la fonction recommander().

En voici une illustration :



1.11.2 Scripts lis aux formulaires

1.11.2.1 Transformer en majuscules le contenu saisi dans un champ Dans cet exemple, on dcouvre que la valeur dun attribut vnement peut tre une instruction et non une fonction. La valeur de lattribut commence par le mot-cl javascript: suivi de linstruction.

Nom:

Prnom:

Le script se rsume cette seule instruction. Lorsque lobjet titre perdra le focus, son contenu sera transform en majuscules.

1.11.2.2 Vider le contenu dun champ en cliquant sur un bouton Ce script peut tre intressant lorsque le champ contient une valeur par dfaut et que cette valeur ne convient pas. Cela vite lutilisateur du formulaire de devoir effacer manuellement la valeur.

En cas de clic sur le bouton, le contenu de llment numro 0 est effac.

Valeur:

1.11.2.3 Vider le contenu dun champ (valeur par dfaut) lorsquon lui donne le focus Lutilit de ce script est semblable celle du script prcdent. La manipulation est encore plus rapide. Il est parfois intressant demployer cette technique pour garnir le champ dune valeur par dfaut qui donne une indication sur linformation fournir ( votre nom ).



1.11.2.4 Contrler que le contenu dun champ est dune longueur minimale La fonction alert() affiche une bote de dialogue comportant un message dalerte. Cest la proprit length du contenu du champ qui est teste. La fonction renvoie un boolen car elle est utilise comme valeur de lattribut onsubmit du formulaire.

Au niveau du formulaire, on aura :

Identificateur

Mot de passe

Un des paramtres est la rfrence faite la proprit value du champ mp du formulaire courant (this).

1.11.2.5 Augmenter la taille dun champ en fonction de son contenu Ce script permet un champ de slargir si son contenu est trop large pour la taille du champ. Cet agrandissement na toutefois lieu que lorsque le champ perd le focus.

function augmente(){

var taille = document.form1.champ.size;

if(document.form1.champ.value.length>=taille){

document.form1.champ.size = document.form1.champ.value.length;}

else {document.form1.champ.size = taille;}

}



Cest la valeur de lattribut size du champ texte et la proprit de longueur du contenu de celui-ci qui sont concerns par ce script. Lorsquune modification du contenu du champ a lieu, la fonction augmente() est active.

Champ qui s'agrandit:

Autre champ

1.11.2.6 Vrification (simple) dune adresse email On se contente ici de vrifier que larrobase fait bien partie de la chane encode.



Le corps du document contiendra la dfinition suivante de formulaire:

Nom

Adresse email

En cas de fourniture dadresse dpourvue darrobase, un message sera affich comme le montre lillustration ci-aprs.

1.11.2.7 Remplir une liste en fonction dun choix par bouton radio Cet exemple montre que les choix proposs aux internautes peuvent tre fonction dautres choix que font ces derniers. Il illustre aussi la cration dobjet et inclus des lments de mise en page au moyen de styles CSS (voir dernire ligne de code et illustration).



var o=new Option("Chat","2");

form.liste.options[form.liste.options.length]=o;

var o=new Option("Chien","3");


var o=new Option("Renard","4");


var o=new Option("Canard","5");


}

function sports(form,list){

list.options.length=0;

var o=new Option("Tennis","1");


var o=new Option("Basket","2");


var o=new Option("Natation","3");


}

function fleurs(form,list){

list.options.length=0;

var o=new Option("Rose","1");


var o=new Option("Tulipe","2");


var o=new Option("Narcisse","3");


var o=new Option("Jonquille","4");


}

-->

Les fonctions animaux(), sports() et fleurs() ont pour but de crer des listes. Une de ces listes sera cre en fonction du choix de linternaute. Un objet Option est cr en donnant son tiquette et sa valeur.

Dans la description du formulaire qui suit, on voit quen fonction du bouton radio cliqu, cest lune ou lautres des trois fonctions qui est active, crant une liste danimaux, de sports ou de fleurs.



Animaux

Sports

Fleurs

Liste vide

Au dpart, la liste est vide ou plutt, elle ne contient que litem Liste vide . Lorsquun choix est fait, la liste se remplit des items correspondants.

1.12 Exercice Crez un formulaire votre got et selon vos intrts. Il devra contenir des champs texte, une liste droulante, un groupe de boutons radios et lune ou lautre case cocher, un bouton simple qui permet de faire excuter un script local (vrification du remplissage de certains champs) et un bouton de soumission. Noubliez pas de donner des tiquettes aux objets du formulaire.

La page contiendra la date du jour et la date de dernire modification.

Lorsque le formulaire sera soumis, une page contenant des bribes de code PHP reconstituera un document HTML reprenant quelques-unes des donnes fournies avec, si possible, un petit traitement sur lune ou lautre donne (par exemple en rcrivant nom et prnom dans lordre inverse avec linitiale du prnom seulement)14.

14 Vous pouvez dj consulter la liste des fonctions PHP pour faire quelques manipulations simples.



2. Le langage PHP 2.1 En quoi consiste PHP ? PHP est un langage de scripts open ource15. Comme beaucoup dautres langages, il a t spcialement conu pour le dveloppement d'applications web. Il peut tre intgr au HTML. Pour ce faire, le code PHP est inclus entre une balise de dbut (ensemble de symboles) et une balise de fin qui permettent au serveur web de passer en mode PHP. La partie PHP correspond donc la partie crative et dynamique du document HTML finalement envoy par le serveur et que le navigateur transformera en page Web.

Mlange HTML - PHP

Partie statique (HTML pur et dur)

Cette partie du texte est du HTML classique.

Partie dynamique (HTML construit)



Contrairement au code JavaScript, le code PHP est excut par le serveur et non par le client. Le client ne reoit que le rsultat du script, sans aucun moyen d'avoir accs au code qui a produit ce rsultat. Si vous donnez aux fichiers HTML correspondant des pages statiques lextension PHP, linternaute na aucun moyen de distinguer les pages qui sont produites dynamiquement des pages statiques. Voici la partie intressante de la source qua reue le navigateur dans lexemple prcdent :

Partie statique (HTML pur et dur)

Cette partie du texte est du HTML classique.

Partie dynamique (HTML construit)

Celle-ci a t transforme en HTML au niveau du serveur, par l'analyseur PHP.

Tous les fichiers contenant des instructions en PHP doivent possder lextension .php16.

2.2 Quoffre PHP? PHP est principalement conu pour servir de langage de script cot serveur. Il est capable de raliser tout ce qu'un script CGI peut faire17. Il est principalement utilis pour crire des scripts de collecte de donnes issues de formulaires, de stockage ventuel de ces donnes dans une base de donnes, de gnration dynamique de contenu (voir petit exemple ci-dessus), C'est l'utilisation la plus traditionnelle et le principal objet de PHP. Trois composants sont ncessaires:

un analyseur PHP,

un serveur Web (Apache, par exemple),

un navigateur web. Le serveur Web doit sexcuter en corrlation avec PHP, ce qui ncessite une configuration particulire et pas forcment vidente raliser. Cest pourquoi il existe des environnements logiciels grce auxquels ces problmes passent au second plan18.

Notez quil est aussi possible dcrire des scripts PHP et de les excuter en ligne de commande, sans l'aide du serveur Web et d'un navigateur. Il faut, pour cela, disposer de l'excutable PHP. Cette utilisation est intressante pour des scripts qui doivent tre excuts rgulirement.

PHP est utilisable sur la majorit des systmes d'exploitation et supporte la plupart des serveurs Web actuels et notamment Apache et Microsoft Internet Information Server (IIS).

Vous avez galement le choix d'utiliser la programmation procdurale, la programmation objet, ou un mlange des deux.

16 Dautres extensions sont reconnues telles php3, phtml, pour autant quelles soient fournies au serveur Web via le fichier .httpd.conf. Par exemple : AddType application/x-httpd-php .phtml .pwml .php3 .php4 .php .php2 .inc. 17 CGI (Common Gateway Interface) est un moyen de faire communiquer le client Web avec des applications crites dans diffrents langages et disponibles au niveau du serveur. Lutilisation de scripts CGI demande, bien entendu, quelques efforts de configuration. 18 http://www.easyphp.org/telechargements.php3



PHP ne se limite pas la production de code HTML. Il peut aussi gnrer des images, des fichiers PDF, et mme des animations Flash. Il gnre facilement du texte et donc aussi, du code XML ou XHTML. PHP gnre ces fichiers et les sauve dans le systme de fichiers, ou bien les envoie au navigateur web.

Mais, ce qui nous intresse davantage, PHP possde de nombreuses fonctions permettant dexploiter les bases de donnes parmi lesquelles: InterBase, PostgreSQL, dBase, MySQL, IBM DB2, ODBC, Informix, Oracle et Ingres, pour ne citer que les plus connues.

2.3 Les bases du langage 2.3.1 lments de syntaxe

2.3.1.1 Les balises PHP Il y a quatre jeux de balises pouvant servir dlimiter des blocs de code PHP. Seuls deux d'entre eux sont actifs coup sr19: et . . ..

Mlange HTML - PHP

Cette partie du texte est interprte par le navigateur.

echo "Celle-ci le sera par l'analyseur PHP.";

Cette deuxime syntaxe est videmment plus lourde. Dans la suite de ces notes, nous utiliserons toujours la premire.

2.3.1.2 Les sparateurs d'instructions Le sparateur d'instructions est le symbole ";". Il est ncessaire partout sauf devant la balise de fin d'excution du PHP soit "?>".

2.3.1.3 Les commentaires Comme dans de nombreux autres langages, les caractres se trouvant entre les couples de symboles "/*" et "*/" ne sont pas pris en compte par l'analyseur.

Les commentaires jusqu'en fin de ligne commencent par les symboles "//" ou le symbole "#".

Mlange HTML - PHP

19 Les balises courtes (sans le mot-cl php) et les balises ASP peuvent tre actives et dasctives au niveau du fichier php.ini.



Cette partie du texte est interprte par le navigateur.

Dans cet exemple, on constate que

la casse des caractres est importante dans les noms de variables,

les chanes de caractres constantes s'crivent entre guillemets ou apostrophes,

la fonction echo admet plusieurs arguments spars par des virgules,



une vraie apostrophe dans une chane de caractres, elle-mme dlimite par des apostrophes, doit tre prcde de la barre oblique inverse (\).

Les variables sont affectes par valeur mais peuvent aussi l'tre par rfrence ( partir de PHP4). Dans ce deuxime cas, la nouvelle variable ne fait que rfrencer la variable originale. Les modifications de la nouvelle variable affecteront l'ancienne, et vice versa. Pour assigner par rfrence, on ajoute le symbole "&" au nom de la variable source.

Nommage des variables et affectations

Observez que l'affectation se fait au moyen du symbole "=" alors que l'oprateur de comparaison est (voir plus loin) "==".

L'instruction print $a+$b.' '; est particulire. La premire expression est le rsultat d'une opration entre deux entiers (voir les types, ci-aprs), alors que la seconde est une chane constitue du seul caractre "espace". L'oprateur entre les deux, symbolis par le point (.), est un oprateur de concatnation. L'expression entire est donc automatiquement transforme en chane de caractres avant d'tre affiche.

2.3.2.2 Porte des variables Les variables ont une porte globale si elles ne sont pas dfinies lintrieur dune fonction. Elles sont accessibles partout dans le script. Les variables dfinies lintrieur dune fonction sont locales. De mme, les variables dfinies en dehors dune fonction ne sont pas directement accessibles lintrieur de celle-ci.



Il est possible daccder aux variables globales lintrieur des fonctions. De mme, il est possible de rendre visibles partout les variables dfinies dans une fonction.

Le script qui suit illustre la porte des variables. lintrieur dune fonction, il est possible daccder une variable globale par lintermdiaire du tableau prdfini $GLOBALS[]. Ce tableau est index par les noms des variables (sans le symbole $). Pour rendre une variable locale visible, il faut utiliser la dclaration global.



En voici un exemple :

Mme si vous ne connaissez pas encore cette structure rptitive, il est facile de comprendre ce que fait cette partie de script. Les valeurs dun formulaire dcorent le tableau $_POST qui contient les valeurs envoyes au serveur par le client. Pour clater ce tableau en autant de variables que ncessaire, on cre des variables contenant chaque fois une chane de caractres commenant par le caractre de soulignement, suivi du nom de la variable (cl dindex du tableau). On utilise ces chanes comme nom pour des variables qui contiendront les valeurs transmises.

Exemple : si les couples cls-valeurs transmis sont (nom, Vandeput), (prenom, tienne), (departement, DET), les variables cres seront respectivement $_nom, $_prenom et $_departement et contiendront les valeurs Vandeput, tienne et DET.

2.3.2.4 Variables externes PHP manipule aussi des variables provenant de l'extrieur comme, nous venons juste de le rappeler, les variables provenant de la soumission d'un formulaire. C'est d'ailleurs l une de ses qualits. Ces variables sont aisment accessibles travers des tableaux prdfinis. Parmi ceux-ci, notons $GLOBALS qui rassemble les variables globales, $_POST et $_GET qui contiennent respectivement les valeurs transmises par la mthode post et celles qui ont t transmises par la mthode get, ou encore $_SERVER.

Nous vous renvoyons la documentation pour plus de dtails. Nous donnons ici quelques exemples dinformations normalement20 disponibles au niveau du serveur

La variable $_SERVER



echo $_SERVER['HTTP_USER_AGENT'].'';

echo "Nom du serveur qui excute le script: ";

echo $_SERVER['SERVER_NAME'].'';

?>

dont voici le rsultat dans un contexte donn :

Un autre moyen daccder aux valeurs du tableau $_server est dactiver la fonction prdfinie phpinfo() dans un script.

Linstruction placer dans le fichier php est :



Voici un petit exemple qui illustre le profit que lon peut ventuellement tirer de telles informations. La composante $_SERVER[REMOTE_ADDR] reprsente ladresse IP du client. Supposons quune page soit rserve une catgorie de clients identifiables par leur adresse IP (par exemple, les Facults : 138.48.). Il suffit de vrifier que le client a bien une adresse commenant par ces deux valeurs. La fonction explode(,) renvoie un tableau dont les composantes sont les lments de la chane spares par le sparateur .

$adresseIP=explode(".",$_SERVER['REMOTE_ADDR']);

if(adresseIP[0]!="138"||adresseIP[1]!="48"){

echo htmlentities("Accs limit aux FUNDP");

exit;

}

La fonction htmlentities() convertit les caractres spciaux en entits HTML (exemple : devient . Lutilisation de cette fonction vite un certain nombre de surprises.

2.3.3 Les constantes Une constante est un identifiant qui reprsente une valeur simple. Le nom de constante valide commence par une lettre ou un soulign (_), suivi d'un nombre quelconque de lettre, chiffres ou souligns. Par convention, les constantes sont toujours en majuscules.

Les constantes sont dfinies grce la fonction define() et ne peuvent tre redfinies.

$a=3;

define("VALMAX","100");

$a+=VALMAX;

echo $a;

affichera la valeur 103.

Elles sont accessibles de manire globale.

$a=3;

define("VALMAX","100");

$a+=VALMAX;

echo $a.'';

function test(){

echo VALMAX;

}

test();

2.3.4 Types Habituellement en PHP, le type d'une variable n'est pas dclar par le programmeur. Il est dcid au moment de l'excution, en fonction du contexte dans lequel la variable est utilise (voir exemple ci-dessus pour la variable adresseIP).

Il y a huit types de base dont:

quatre types scalaires (valeurs indcomposables)



boolen

entier

nombre virgule flottante

chane de caractres deux types composs

tableau

objet et deux types spciaux

ressource

null Comme d'autres langages, PHP offre la possibilit de "transtyper" les variables (casting). Nous examinons rapidement les types scalaires. Les autres types seront analyss plus loin.

2.3.4.1 Boolen Classiquement, les valeurs sont true et false (casse sans importance). Les variables des autres types peuvent tre transtypes en variable boolenne. Ainsi, par exemple, la valeur entire 0, la valeur en nombre virgule 0.0, la chane vide ou la chane "0" prennent la valeur false lorsqu'elles sont transtypes en boolen.

2.3.4.2 Entier Les entiers peuvent tre spcifis en base dcimale, en hexadcimal ou en octal et optionnellement tre prcds d'un signe.

Selon les systmes, environ 4 milliard de valeurs signes sont possibles (codage sur 32 bits).

2.3.4.3 Nombre virgule flottante Voici quelques exemples illustrant la syntaxe admise.



La taille des nombres dcimaux dpend de la plateforme. La configuration la plus rpandue permet de coder des nombres dont l'ordre de grandeur est de 1.8E308 avec une prcision de 14 dcimales. C'est le format 64 bits IEEE.

Il ne faut jamais faire confiance aux nombres virgule jusqu' leur dernire dcimale et s'interdire de les comparer avec l'oprateur d'galit.

2.3.4.4 Chane de caractres Il y a trois manires diffrentes de construire des chanes de caractres:

en utilisant les apostrophes;

en utilisant les guillemets;

en utilisant la syntaxe HEREDOC (dont nous ne parlerons pas).

2.3.4.5 Les apostrophes $prenom='tienne';

Si la chane doit contenir des apostrophes, vous devez les chapper avec la barre oblique inverse (\). $titre='L\'cole et les TIC';

C'est pareil pour la barre oblique inverse elle-mme. $remarque='Utilisez la barre oblique inverse (\\) pour chapper les caractres.';

Les noms de variables prsents dans la chane apparatront tels quels. $c='La variable $nom';

Observez que les balises HTML qui ne sont que du texte peuvent tre incluses dans les chanes de caractres. Elles seront interprtes par le navigateur.

2.3.4.6 Les guillemets L'apostrophe ne doit plus tre chapp mais bien le guillemet. Les noms de variables sont remplacs par leurs valeurs respectives.



$remarque="Utilisez la barre oblique inverse (\\) pour chapper les caractres.";

$c="Le cours PHP est donn par $prenom.";

$d='Le cours PHP est donn par $prenom.';

$e='Le cours PHP est donn par '.$prenom.'.';

echo $prenom."".$titre."".$remarque."".$c."".$d."".$e;

?>

2.3.5 Oprateurs Comme tout langage de programmation, PHP propose des oprateurs et des fonctions prdfinies, mais offre aussi au programmeur la possibilit de construire ses propres fonctions. Les oprateurs (comme les fonctions prdfinies) sont trop nombreux pour tre dcrits ici. Vous pouvez vous rfrer la documentation en ligne de PHP21. Dans ce qui suit, nous nous contentons dvoquer ceux, parmi les moins classiques, qui prsentent un intrt immdiat. Ils sont utiliss et documents dans les exemples qui suivent.

2.3.5.1 Oprateurs dassignation Lassignation se fait classiquement en utilisant le symbole =. Des facilits sont offertes comme dans de nombreux autres langages :

oprateurs combins += ou .= $a += $b ; // $a = $a + $b ;

$a .= $b ; // $a = $a . $b ;

assignations combines $a = ($b = 5) + 1; // $b = 5 ; $a = $b + 1 ;

2.3.5.2 Oprateurs de comparaison La comparaison peut se faire sur les valeurs mais galement sur les types. Cest la raison pour laquelle, loprateur classique de comparaison ==, sajoute un oprateur qui vrifie en plus lgalit des types ===.

$a === $b possde la valeur true uniquement si les deux variables contiennent les mmes valeurs et sont de mme type.

On trouve de mme des oprateurs != et !== pour tester la diffrence des valeurs et la diffrence des valeurs ou des types.

$a !== $b possde la valeur true si les deux variables contiennent des valeurs diffrentes ou sont de types diffrents. 21 http://www.php.net/manual/fr/



2.3.5.3 Oprateurs dincrmentation dcrmentation Ces oprateurs peuvent tre utiliss de concert avec des tests. Cest la raison pour laquelle on parle de pr ou de post incrmentation/dcrmentation.

++$a incrmente $a avant de renvoyer sa valeur (pour un test ventuel).

$a++ renvoie la valeur de $a avant de lincrmenter.

Les expressions suivantes --$a et $a-- sont les quivalentes en dcrmentation.

2.3.5.4 Oprateurs logiques Les oprateurs logiques habituels, ET, OU et NON sont respectivement symboliss par &&, || et !. Il existe aussi des oprateurs and et or qui sont quivalents && et || ceci prs quils ont une priorit diffrente. Profitons-en pour rappeler quil faut tre attentif la priorit des oprateurs et, en cas de doute, utiliser les parenthses.

2.3.5.5 Oprateurs de chanes Loprateur de concatnation des chanes de caractres est le point.

Si $nom contient la valeur Vandeput et $prenom, la valeur tienne , le texte affich par echo "Bonjour".$prenom." ".$nom.".";

sera Bonjour tienne Vandeput.

Notez la diffrence d'interprtation du point dans et en dehors des guillemets.

2.3.6 Fonctions Une fonction est dfinie de la manire suivante :

function f(p1,p2,,pn){

return v;

}

partir de PHP4, les fonctions peuvent tre dfinies nimporte o. Toutefois, une fonction dfinie lintrieur dune autre fonction nexiste que si cette dernire est appele. De mme, une fonction dfinie de manire conditionnelle nexiste que si la condition est teste et vrifie.

Il est possible de passer les arguments par valeur (mthode par dfaut)

function multiplier($a,$b){

$p=$a*$b ;

return $p ;

}

echo multiplier(4,8);

ou par rfrence function tripler(&$n){

$n*=3 ;

}



$a=5 ;

tripler($a);

echo $a;

Il existe videmment de trs nombreuses fonctions prdfinies en PHP.

2.3.7 Expressions L'association des oprateurs, des fonctions, des variables et des constantes donne naissance des expressions. On peut dire d'une expression, qu'elle a une valeur d'un certain type.

Dans l'exemple qui suit, l'oprateur % dsigne le reste de la division entire de par

donnera

12 modulo 5 gale 2. x vaut 9 et y vaut 4.

Comme vous pouvez le constater, PHP offre les facilits d'criture des langages rcents.

2.3.8 Instructions de contrle Comme la plupart des langages de script, PHP offre une grande varit dinstructions de contrle et une grande souplesse dcriture.

2.3.8.1 Linstruction if Pour commencer, il est important de se rendre compte que des variables de tous types peuvent tre considres comme des expressions boolennes. Ainsi, une variable $x utilise dans un contexte boolen fournira la valeur true si elle ne contient ni la valeur zro numrique, ni la chane vide, ni la valeur logique false et quelle est dfinie.

Par exemple, $x=1;

if($x){

echo "vrai";

}

else{

echo "true";

}

affichera vrai.

Si lutilisation des accolades nest pas ncessaire, elle est souhaitable. Dautres instructions pourraient venir sajouter par la suite.



2.3.8.2 Linstruction if-elseif-else Linstruction if-elseif-else est une instruction trs souple qui permet deffectuer des tests de natures trs diffrentes. Elle peut comporter autant de elseif que ncessaire. chaque nouveau test, comme dans le bloc else, on ne sintresse quaux cas restants.

if($nombre%2){

echo "Nombre impair";

}

elseif($nombre%3){

echo "Nombre non divisible par 3";

}

else{

echo "Nombre pair, multiple de 3";

}

2.3.8.3 L'instruction switch L'instruction switch est une alternative la construction if-elseif-else. Elle est plus souple que dans d'autres langages car elle accepte d'autres valeurs que des valeurs entires. On la prfrera dans les cas o c'est toujours la mme expression qui doit tre teste.

switch($a){

case ($a>99): $b="excessif"; break;

case ($a>75): $b="lev"; break;

case ($a>50): $b="normal"; break;

default: $b="faible";

}

L'instruction break vite le passage aux autres instructions. En l'absence de ces instructions, une valeur de $a de 88 ferait afficher faible et non lev.

2.3.8.4 L'instruction while L'instruction while est la plus courante des instructions de boucles. Le bloc des instructions qu'elle encadre est excut tant que la condition est vrifie, ce qui implique que celle-ci soit value avant le parcours de la boucle.

while($a>50){

$a-=5;

}

echo $a;

Si $a possde toujours la valeur 88, la valeur 48 sera affiche.

Les instructions break et continue permettent respectivement de quitter la boucle ou d'interrompre le cycle en cours pour passer au cycle suivant.

2.3.8.5 L'instruction dowhile L'instruction dowhile permet la boucle d'tre effectue au moins une fois. La condition n'est en effet teste qu'en fin de boucle.



Les instructions qui suivent font afficher les dates des jours qui se succdent d'aujourd'hui jusqu'au premier dimanche de mars.

$jourCourant=time();

echo "\n";

do{

echo "".date("l j F",$jourCourant)." ".date("j",$jourCourant)." ".date("F",$jourCourant)."\n";

$jourCourant+=86400;

}

while(date("l",$jourCourant)!="Sunday"||date("F",$jourCourant)!="March");

echo "\n";

La fonction time() gnre une estampille (le moment prsent exprim en secondes depuis le 1er janvier 1970). La fonction date() a comme arguments un format et une estampille. Pour la signification des formats, rfrez-vous la documentation PHP.

Le script augmente d'un jour le moment courant avant d'en afficher les paramtres dans une liste numrote. Notez que si nous tions le premier dimanche de mars, le script afficherait les paramtres de 365 jours.

2.3.8.6 L'instruction for L'instruction for permet de faire des conomies d'criture dans le cas o le nombre de passages dans la boucle est dterminable.

Voici, dans ces conditions, ce que devient le script prcdent:

echo "\n";

for(

$jourCourant=time();

date("l",$jourCourant)!="Sunday" ||date("F",$jourCourant)!="March";

$jourCourant+=86400

){

echo "".date("l j F",$jourCourant)."\n";

}

echo "\n";

2.3.8.7 L'instruction foreach L'instruction foreach est relative aux tableaux. Nous la dcrirons au moment o nous dtaillerons davantage ces structures intressantes.

2.4 Exercice Un formulaire (incomplet) se prsente de la sorte :



Il s'agit de faire en sorte que le choix du bouton radio Madame introduise les modifications graphiques suivantes :

On ajoutera que les diffrents champs doivent se vider de leur contenu ds quils reoivent le focus.

Lide est dajouter un attribut vnement chacun des boutons radios en y associant la soumission du formulaire avec, comme action, un script de reconstitution du formulaire. Un premier fichier HTML contiendra le formulaire initial. Un second fichier PHP contiendra le script qui reconstituera une nouvelle page avec plus ou moins de champs textes selon le choix.

Monsieur

Madame

Coordonnes:



Les attributs class de certains lments traduisent lutilisation de styles personnaliss. Les attributs onFocus servent au vidage des champs. Lorsquun des boutons est slectionn, laction du formulaire est change et le formulaire est soumis en invoquant le script sexe.php dont le code suit et qui va reconstituer un nouveau formulaire.

Monsieur

Publier sur le Web - Perfect

Développer une application avec PHP et MySQL

Documents

Transcript of Développer une application avec PHP et MySQL