• Aucun résultat trouvé

[PDF] Apprendre la programmation Web PHP avncé : les formulaires - Cours PHP

N/A
N/A
Protected

Academic year: 2021

Partager "[PDF] Apprendre la programmation Web PHP avncé : les formulaires - Cours PHP"

Copied!
34
0
0

Texte intégral

(1)

Chapitre 3

Les Formulaires en PHP

(2)

Plan

Plan

 IntroductionIntroduction

 Eléments de base du langage PHPEléments de base du langage PHP  FonctionsFonctions  TableauxTableaux  FormulairesFormulaires  PHP et MySQLPHP et MySQL  CookiesCookies  SessionsSessions

(3)

Traitement des

Traitement des

Formulaires

Formulaires

(4)

Formulaire : Rappel

Formulaire : Rappel

Objectifs

Objectifs

 Permettre l’interaction avec l’utilisateurPermettre l’interaction avec l’utilisateur  Personnaliser les requêtes sur le webPersonnaliser les requêtes sur le web

 Permettre d’accéder aux BDs sans savoir Permettre d’accéder aux BDs sans savoir

manipuler les SGBDs

manipuler les SGBDs

(5)

Formulaire : Rappel

Formulaire : Rappel

Comment utiliser un formulaire ?

Comment utiliser un formulaire ?

 Réalisation du formulaire (Simple)Réalisation du formulaire (Simple)

 En HTMLEn HTML

 Exploitation du formulaire par un scriptExploitation du formulaire par un script

 CGICGI  PHPPHP  JSPJSP  ASPASP  ……

(6)

Formulaires

Formulaires

 Un formulaire est inséré dans une page HTML Un formulaire est inséré dans une page HTML

par la balise double <FORM>

par la balise double <FORM>

 En plus de ses éléments principaux, le En plus de ses éléments principaux, le

formulaire peut contenir du texte

formulaire peut contenir du texte

 Toutes les mises en forme peuvent être Toutes les mises en forme peuvent être

appliquées aux éléments du formulaire

appliquées aux éléments du formulaire

 Plusieurs formulaires peuvent être insérés Plusieurs formulaires peuvent être insérés

dans la même page

(7)

Formulaires

Formulaires

Principaux attributs d’un formulaire

Principaux attributs d’un formulaire

<FORM

<FORM ACTIONACTION="script" ="script" METHODMETHOD="post" NAME="post" NAME

="nom_form"> ="nom_form">

 ACTIONACTION: URL du script ou prog à exécuter : URL du script ou prog à exécuter

 Chemin du script à exécuter sur les données du formulaireChemin du script à exécuter sur les données du formulaire

 ACTION= "chemin_script" ACTION= "chemin_script"

 Adresse mail à laquelle les données du formulaire seront Adresse mail à laquelle les données du formulaire seront

envoyés

envoyés

(8)

Formulaires

Formulaires

Principaux attributs d’un formulaire

Principaux attributs d’un formulaire

<FORM

<FORM

ACTION

ACTION

="script"

="script"

METHOD

METHOD

="post"

="post"

NAME

NAME

="nom_form">

="nom_form">

METHOD

METHOD

: méthode d’envoi des données

: méthode d’envoi des données

GET

GET

ou

ou

POST

POST

 GET : données du form envoyées avec l’URL du GET : données du form envoyées avec l’URL du

script (limitée)

script (limitée)

 POST: données du form envoyées séparément de POST: données du form envoyées séparément de

l’URL (meilleure)

l’URL (meilleure)

(9)

Formulaires

Formulaires

Balise <INPUT>

Balise <INPUT>

<INPUT> : crée une zone de saisie

<INPUT> : crée une zone de saisie

 Balise monolithiqueBalise monolithique

Principaux attributs

Principaux attributs

 NAMENAME : nom du champ: nom du champ

 SIZESIZE : largeur du cadre réservé au champ: largeur du cadre réservé au champ  MAXLENTH: longueur du texteMAXLENTH: longueur du texte

 TYPETYPE : : ((text, password, radio, checkbox, submit, reset, text, password, radio, checkbox, submit, reset,

file, …

file, …))

(10)

Formulaires

Formulaires

Saisie des champs de texte

Saisie des champs de texte

 Zone de saisie du texteZone de saisie du texte

 ExempleExemple

Votre nom : <INPUT NAME="nom" SIZE=15 MAXLENGTH=30> <BR> Votre nom : <INPUT NAME="nom" SIZE=15 MAXLENGTH=30> <BR>

<BR> <BR> <BR> <BR>

Votre prénom : <INPUT NAME="prenom" SIZE=15 MAXLENGTH=30> Votre prénom : <INPUT NAME="prenom" SIZE=15 MAXLENGTH=30>

(11)

Formulaires

Formulaires

Envoi du formulaire

Envoi du formulaire

 Pour envoyer le formulaire, il suffit de cliquer avec la souris sur Pour envoyer le formulaire, il suffit de cliquer avec la souris sur

un bouton spécial créé par la balise <INPUT>

un bouton spécial créé par la balise <INPUT>  <INPUT TYPE="submit" VALUE="Valider"><INPUT TYPE="submit" VALUE="Valider">

 La valeur "submit" de l’attribut TYPE caractérise le bouton d’envoiLa valeur "submit" de l’attribut TYPE caractérise le bouton d’envoi  La valeur "Valider" de l’attribut VA LUE définit le texte affiché sur La valeur "Valider" de l’attribut VA LUE définit le texte affiché sur

le bouton d’envoi

le bouton d’envoi Exemple

(12)

Formulaires

Formulaires

Données envoyées

Données envoyées

Seuls sont envoyés les noms des champs et

Seuls sont envoyés les noms des champs et

les valeurs correspondantes

les valeurs correspondantes

 ExempleExemple

nom=Ali

nom=Ali&&prenom=Mohamedprenom=Mohamed++AmineAmine

 Deux champs successifs sont séparés par le Deux champs successifs sont séparés par le

caractère

caractère &&

 L’espace est remplacé par le caractère L’espace est remplacé par le caractère + + dans la dans la

valeur d’un champs

(13)

Formulaires

Formulaires

Modification du formulaire

Modification du formulaire

 Après avoir rempli les données du formulaire, nous pouvons les Après avoir rempli les données du formulaire, nous pouvons les effacer tous avec un bouton créé par la balise <INPUT>

effacer tous avec un bouton créé par la balise <INPUT>

 Avant l’envoi du formulaireAvant l’envoi du formulaire

 <INPUT TYPE="reset" VALUE="Effacer"><INPUT TYPE="reset" VALUE="Effacer">

 La valeur "reset" de l’attribut TYPE caractérise le bouton de La valeur "reset" de l’attribut TYPE caractérise le bouton de

modification modification

 La valeur " Effacer" de l’attribut VA LUE définit le texte affiché sur le La valeur " Effacer" de l’attribut VA LUE définit le texte affiché sur le

bouton d’envoi bouton d’envoi

Exemple

(14)

Formulaires

Formulaires

Saisie d’un mot de passe

Saisie d’un mot de passe

L’attribut TYPE avec la valeur "password" permet de

L’attribut TYPE avec la valeur "password" permet de

masquer un champs lors de la saisie, ses caractères

masquer un champs lors de la saisie, ses caractères

sont remplacés par des points ou des étoiles

sont remplacés par des points ou des étoiles

<INPUT

<INPUT TYPE ="password"TYPE ="password" NAME="passwd" SIZE=15 NAME="passwd" SIZE=15 MAXLENGTH=30>

MAXLENGTH=30>

Exemple

(15)

Formulaires

Formulaires

Boutons radio

Boutons radio

Notation

Notation

<INPUT TYPE ="radio" NAME ="nom_radio" VALUE="valeur1"> texte <INPUT TYPE ="radio" NAME ="nom_radio" VALUE="valeur1"> texte du bouton1

du bouton1

<INPUT TYPE ="radio" NAME =" nom_radio" VALUE="valeur2"> texte <INPUT TYPE ="radio" NAME =" nom_radio" VALUE="valeur2"> texte du bouton2

du bouton2

La valeur de l’attribut NAME est commune à tous les boutons

(16)

Formulaires

Formulaires

Boutons radio

Boutons radio

Sélectionner un élément dans une liste

Sélectionner un élément dans une liste

 Cocher avec la sourisCocher avec la souris

Une deuxième sélection annule la première

Une deuxième sélection annule la première

 Choix exclusifChoix exclusif

Exemple

Exemple

(17)

Formulaires

Formulaires

Boutons radio

Boutons radio

L’attribut CHECKED permet de cocher par

L’attribut CHECKED permet de cocher par

défaut l’un des boutons

défaut l’un des boutons

<INPUT TYPE ="radio" NAME ="nom_radio" VALUE="valeur1" CHECKED> texte du <INPUT TYPE ="radio" NAME ="nom_radio" VALUE="valeur1" CHECKED> texte du bouton1

bouton1

<INPUT TYPE ="radio" NAME =" nom_radio" VALUE="valeur2"> texte du bouton2 <INPUT TYPE ="radio" NAME =" nom_radio" VALUE="valeur2"> texte du bouton2

Exemple

(18)

Formulaires

Formulaires

Cases à cocher

Cases à cocher

 Notation :Notation : <INPUT TYPE ="

<INPUT TYPE ="checkboxcheckbox" NAME ="nom_cases" VALUE="valeur1"> texte case1" NAME ="nom_cases" VALUE="valeur1"> texte case1 <INPUT TYPE ="

<INPUT TYPE ="checkboxcheckbox" NAME ="nom_cases" VALUE=" valeur2"> texte case2" NAME ="nom_cases" VALUE=" valeur2"> texte case2 <INPUT TYPE ="

(19)

Formulaires

Formulaires

Cases à cocher

Cases à cocher

 Sélectionner un élément Sélectionner un élément

dans une liste

dans une liste

 Cocher avec la sourisCocher avec la souris

 Possibilité de cocher Possibilité de cocher

plusieurs éléments

plusieurs éléments

 Un clique sélectionne Un clique sélectionne

l’élément

l’élément

 le 2 ème clique annule la le 2 ème clique annule la

sélection

sélection

(20)

Formulaires

Formulaires

Cases à cocher

Cases à cocher

Possibilité de cocher

Possibilité de cocher

une ou plusieurs

une ou plusieurs

cases par défaut

cases par défaut

avec

l’attribut

avec

l’attribut

CHECKED

CHECKED

Exemple Exemple

(21)

Formulaires

Formulaires

Menu déroulant

Menu déroulant

 Balise double <SELECT>Balise double <SELECT>

 Principaux attributs : NAME, SIZE, MULTIPLEPrincipaux attributs : NAME, SIZE, MULTIPLE

 Sélectionner un élément dans un menuSélectionner un élément dans un menu

(22)

Formulaires

Formulaires

Menu déroulants

Menu déroulants

Exemple Ville(s) visités : <SELECT NAME="ville" >

<OPTION VALUE="RA"> Rabat <OPTION VALUE="FE"> Fès

<OPTION VALUE="MA"> Marrakech <OPTION VALUE="AG"> Agadir <OPTION VALUE="TA"> Tanger </SELECT>

(23)

Formulaires

Formulaires

Menu déroulant

Menu déroulant

 SIZE : indique le nombre de Lignes visibles du SIZE : indique le nombre de Lignes visibles du

menu

menu

 Si SIZE < nb d’éléments du menu alors une barre de Si SIZE < nb d’éléments du menu alors une barre de

défilement apparaît

défilement apparaît

Exemple

(24)

Formulaires

Formulaires

Menu déroulant

Menu déroulant

 Possibilité de sélectionner plusieurs élémentsPossibilité de sélectionner plusieurs éléments

 Le nom de l’élément doit être suivi de : []Le nom de l’élément doit être suivi de : []  Attribut : MULTIPLEAttribut : MULTIPLE

Exemple

(25)

Formulaires

Formulaires

Menu déroulant

Menu déroulant

 Possibilité de sélectionner un élément par Possibilité de sélectionner un élément par

défaut

défaut

 Attribut : SELECTEDAttribut : SELECTED

Exemple

(26)

Formulaires

Formulaires

TEXTAREA : zone de texte

TEXTAREA : zone de texte

 La balise double La balise double

<TEXTAREA> permet de crée

<TEXTAREA> permet de crée

une zone de saisie de texte

une zone de saisie de texte

 Principaux attributs : NAME, Principaux attributs : NAME, COLS, ROWS

COLS, ROWS

 COLS : nombre de colonnesCOLS : nombre de colonnes  ROWS : nombre de lignesROWS : nombre de lignes

 ExempleExemple : : Votre commentaire : Votre commentaire : <TEXTAREA NAME="comment" <TEXTAREA NAME="comment" ROWS=5 ROWS=5 COLS=40></TEXTAREA COLS=40></TEXTAREA>>

(27)

Etapes d’exploitation d’un

Etapes d’exploitation d’un

formulaire

formulaire

 Accès à la page du formulaire (son URL)Accès à la page du formulaire (son URL)  Remplissage/modification des champsRemplissage/modification des champs  Envoi du formulaire(submit)Envoi du formulaire(submit)

 Récupération des paramètres par le Récupération des paramètres par le

script

script

 Traitement du formulaireTraitement du formulaire  CalculCalcul

 TransformationTransformation  Accès aux BD …Accès aux BD …

Renvoi de la réponse au client

Renvoi de la réponse au client

Client

(28)

Récupération des paramètres

Récupération des paramètres

 Les différents éléments du formulaire sont Les différents éléments du formulaire sont

récupérés par le script dans des variables

récupérés par le script dans des variables

 Deux cas selon la configuration de Deux cas selon la configuration de register_globals

register_globals

register_globals=onregister_globals=on

register_globals=off register_globals=off (par défaut à partir de la (par défaut à partir de la

version PHP4.2)

(29)

Récupération des paramètres

Récupération des paramètres

register_globals=onregister_globals=on

 Les paramètres sont récupérés directement dans des Les paramètres sont récupérés directement dans des

variables qui ont les mêmes noms que leurs homologues

variables qui ont les mêmes noms que leurs homologues

dans le formulaire.

dans le formulaire.

 De moins en moins utiliséeDe moins en moins utilisée

 ExempleExemple

 Dans le formulaire Dans le formulaire <input name="nom" ><input name="nom" >

 Dans le script, cet élément est récupéré dans la variable Dans le script, cet élément est récupéré dans la variable

$nom $nom

(30)

Récupération des paramètres

Récupération des paramètres

register_globals=offregister_globals=off

 Les paramètres sont récupérés dans un tableau :Les paramètres sont récupérés dans un tableau :

$_POST["nom_champs"] si la méthode d’envoi est POST$_POST["nom_champs"] si la méthode d’envoi est POST$_GET["nom_champs"] si la méthode d’envoi est GET$_GET["nom_champs"] si la méthode d’envoi est GET

 ExempleExemple

 Dans le formulaire Dans le formulaire <input name="nom" ><input name="nom" >

 Dans le script, cet élément est récupéré selon la méthode Dans le script, cet élément est récupéré selon la méthode d’envoi par :

d’envoi par :

$_POST["nom"]$_POST["nom"]$_GET["nom"]$_GET["nom"]

(31)

Récupération des paramètres

Récupération des paramètres

Dans la suite nous supposons que

Dans la suite nous supposons que

register_globals =off

(32)

Récupération des paramètres

Récupération des paramètres

 Zone de saisie, bouton radio et zone de texteZone de saisie, bouton radio et zone de texte

 L’élément est récupéré par son nomL’élément est récupéré par son nom

$_POST["nom_champs"] ou $_GET ["nom_champs"]$_POST["nom_champs"] ou $_GET ["nom_champs"]

 Cases à cocherCases à cocher

 Chaque élément a un nom différentChaque élément a un nom différent

(33)

Récupération des paramètres

Récupération des paramètres

 Liste de sélectionListe de sélection

 A choix unique : de la même façon que la zone de saisieA choix unique : de la même façon que la zone de saisie  A choix multiple :A choix multiple :

 Le nom de l’élément dans le formulaire doit être suivi des ‘[ ]’Le nom de l’élément dans le formulaire doit être suivi des ‘[ ]’  Dans le script PHP la liste est récupérée dans un tableau selon Dans le script PHP la liste est récupérée dans un tableau selon

la méthode :

la méthode :

$tb = $_POST["nom_list_sel"]$tb = $_POST["nom_list_sel"]$tb = $_GET["nom_list_sel"]$tb = $_GET["nom_list_sel"]

(34)

Traitement du formulaire

Traitement du formulaire

 Du code PHP : tout est permisDu code PHP : tout est permis

 CalculCalcul

 TransformationTransformation

 Manipulation des fichiersManipulation des fichiers  Accès aux BDAccès aux BD

Références

Documents relatifs

[r]

The study focuses on phonological, orthographical, lexical, syntactical, semantic, pragmatic and tex- tual aspects and reveals the overwhelming influence of French, English and

[r]

[r]

[r]

[r]

[r]

[r]