Formulaire HTML et traitement PHP

illustré par l'exemple

Ce document met en rapport

le code d'un formulaire HTML pour créer des champs de saisie ;
le code PHP pour récupérer les données ;

au moyen d'exemples commentés.

form, versant HTML

Pour déclarer un formulaire :

... le corps du formulaire ...

</form>

Commentaires HTML :

Le formulaire HTML doit être placé entre les balises <form ... </form>. Dans notre exemple, la position des balises est <body><form ... </form></body>.
action="formulaire-01.php" porte le nom du fichier PHP qui dépouille le questionnaire.

form, versant PHP

Le fichier PHP qui dépouille le formulaire doit porter le nom du fichier déclaré avec action="formulaire-01.php".

text, versant HTML

Pour déclarer un champ text :

<p>Prénom Nom: <input type="text" name="nom"></p>

Commentaires HTML :

Le champ text s'appelle "nom".

Aperçu

Prénom Nom:

text, versant PHP

Pour récupérer les données du champ text (vers le début du script) :

$nom = filter_input(INPUT_POST, 'nom');

if(strlen($nom)>0){

echo "<p>Nom: ".$nom."</p>";

} else {

echo "<p>Erreur: le nom manque.</p>";

}

Commentaires PHP :

La récupération se fait avec filter_input(INPUT_POST, 'nom') où 'nom' doit correspondre à la déclaration name="nom" de la partie HTML.
Le nom de la variable $nom peut être choisi librement.

number, versant HTML

Pour déclarer deux champs numériques :

<p>Nombre d'articles: <input type="number" name="nbreart" min="0" step="1" max="99" value="1"></p>
<p>Prix d'un article: <input type="number" name="prixunit" min="0" step="0.05" max="999.95"></p>

Commentaires HTML :

Le premier champ numérique reçoit une valeur entière comprise entre 0 et 99 inclusivement.
Le deuxième champ reçoit une valeur numérique qui peut prendre les valeurs 0, 0.05, 0.10, 0.15, 0.20, 0.25, ..., 999.90, 999.95

Aperçu

Nombre d'articles:

Prix d'un article:

number, versant PHP

Pour récupérer les données des champs numériques :

$nbreart = filter_input(INPUT_POST, 'nbreart', FILTER_VALIDATE_INT);

if(is_numeric($nbreart)){

echo "<p>Nombre d'articles: ".$nbreart."</p>";

} else {

echo "<p>Erreur: le nombre d'articles manque.</p>";

}

$prixunit = filter_input(INPUT_POST, 'prixunit', FILTER_VALIDATE_FLOAT);

if(is_numeric($prixunit)){

echo "<p>Prix d'un article: ".$prixunit."</p>";

} else {

echo "<p>Erreur: le prix unitaire de l'article manque.</p>";

}

Commentaires PHP :

La récupération des nombres se fait avec un filtre qui vérifie s'il s'agit bien d'un entier, respectivement d'un nombre à virgule flottante :
filter_input(INPUT_POST, 'nbreart', FILTER_VALIDATE_INT)
filter_input(INPUT_POST, 'prixunit', FILTER_VALIDATE_FLOAT)
où 'nbreart' et 'prixunit' doivent correspondre aux déclarations name="nbreart" et name="prixunit" de la partie HTML
Les noms de variables $nbreart et $prixunit peuvent être librement choisis.

textarea, versant HTML

Pour déclarer une zone de texte :

<p>Message</p>
<p><textarea name="message" cols="50"></textarea></p>

Commentaires HTML :

En accrochant le coin inférieur droit, on peut redimensionner la zone de texte.

Aperçu

Message

textarea, versant PHP

Pour récupérer les données de la zone de texte (vers le début du script) :

$message = filter_input(INPUT_POST, 'message');

if(strlen($message)>0){

echo "<p>Message</p>";

echo "<p><i>".$message."</i></p>";

} else {

echo "<p>Erreur: le message manque.</p>";

}

Commentaires PHP :

La récupération se fait avec filter_input(INPUT_POST, 'message') où 'message' doit correspondre à la déclaration name="message" de la partie HTML.
Le nom de la variable $message peut être choisi librement.

radio, versant HTML

Pour déclarer un bouton radio :

<p>Sexe</p>
<p style="line-height:1.5">
<input type="radio" name="sexe" value="h" checked>homme<br>
<input type="radio" name="sexe" value="f">femme
</p>

Commentaires HTML :

Le bouton s'appelle sexe. Il possède deux valeurs : h ou f.
Un bouton peut être présélectionné ; ici, h.

Aperçu

Sexe

homme
femme

radio, versant PHP

Pour récupérer les données du bouton radio (vers le début du script) :

$sexe = filter_input(INPUT_POST, 'sexe');

if ($sexe==='h'){

echo "<p>Sexe: homme</p>";

} elseif ($sexe==='f'){

echo "<p>Sexe: femme</p>";

} else {

echo "<p>Erreur: le sexe n'est pas défini.</p>";

}

Commentaires PHP :

$sexe prend l'une des deux valeurs : h ou f qui sont des chaînes de caractères.
La comparaison se fait avec trois signes d'égalité.

select, versant HTML

Pour déclarer un sélecteur :

<p>Étage
<select name="etage">
<option value="-1">Sous-sol</option>
<option value="0">Rez</option>
<option value="1">1</option>
<option value="2" selected>2</option>
<option value="3">3</option>
<option value="4">4</option>
</select></p>'

Commentaires HTML :

Le sélecteur s'appelle etage. 'Sous-sol', 'Rez', '1', ... sont les textes affichés dans le formulaire.
Les valeurs '-1', '0', '1', ... sont les représentations internes envoyées à PHP.
Une valeur peut être présélectionnée ; ici, '2'.

Aperçu

Étage

select, versant PHP

Pour récupérer les données du sélecteur (vers le début du script) :

$etage = filter_input(INPUT_POST, 'etage');

if ($etage==='-1'){

echo "<p>Étage: Sous-sol</p>";

elseif ($etage==='0'){

echo "<p>Étage: Rez</p>";

} else {

echo '<p>Étage: '.$etage.'</p>';

}

Commentaires PHP :

$etage est une chaîne de caractères, mais une valeur numérique est aussi possible.

checkbox, versant HTML

Pour déclarer une liste de cases à cocher :

<p style="line-height:1.5;">
<input type="checkbox" name="todo[]" value="francais">Français<br>
<input type="checkbox" name="todo[]" value="maths" checked>Mathématiques<br>
<input type="checkbox" name="todo[]" value="anglais">Anglais<br>
<input type="checkbox" name="todo[]" value="economie" checked>Économie
</p>

Commentaires HTML :

Un même nom, ici todo[], est utilisé pour une série de checkbox distinguées par leurs valeurs. Le nom est suivi de crochets dont la fonction est déclarer que todo[] n'est pas une simple chaîne de caractères, mais une liste.
Lorsqu'on ne donne pas de valeurs aux indices, ils prennent par défaut les valeurs suivantes: todo[0], todo[1], todo[2], ...
Avec checked, on peut déclarer que certaines cases sont initialement cochées ; ici, Mathématiques et Économie.

Aperçu

Français
Mathématiques
Anglais
Économie

checkbox, versant PHP

Pour récupérer les données des cases à cocher (vers le début du script) :

if (is_array($_POST['todo'])){

$todo = $_POST['todo'];

} else {

$todo = array();

}

Pour traiter chaque case à cocher (au fil du script) :

if (in_array('francais', $todo)){

echo "<p>Traitement du cas où la case Français est cochée</p>";

} else {

echo "<p>Traitement du cas où la case Français n'est pas cochée</p>";

}

if (in_array('maths', $todo)){

echo "<p>Traitement du cas où la case Mathématiques est cochée</p>";

} else {

echo "<p>Traitement du cas où la case Mathématiques n'est pas cochée</p>";

}

if (in_array('anglais', $todo)){

echo "<p>Traitement du cas où la case Anglais est cochée</p>";

} else {

echo "<p>Traitement du cas où la case Anglais n'est pas cochée</p>";

}

if (in_array('economie', $todo)){

echo "<p>Traitement du cas où la case Économie est cochée</p>";

} else {

echo "<p>Traitement du cas où la case Économie n'est pas cochée</p>";

}

Commentaires PHP :

Dans le cas où une case au moins est cochée, $_POST['todo'] est une liste de valeurs.
Dans le cas où aucune case n'est cochée, $_POST['todo'] est remplacé par une liste vide.
Si la case Français est cochée, la valeur 'francais', sous la forme d'une chaîne de caractères, se trouve dans la liste $todo ; sinon, la valeur 'francais' est absente de la liste $todo.
L'appartenance d'une valeur à la liste $todo (ou sa non appartenance) permet de traiter chaque case à cocher.

hidden, versant HTML

Pour déclarer des données à stocker dans la page :

Commentaires HTML :

Dans cet exemple, des données sont stockées dans un array nommé data.

Aperçu

Les données hidden ne sont pas affichées. Par contre, elles ne sont pas cachées puisqu'on peut les voir en affichant le code source de la page.

hidden, versant PHP

Pour récupérer les données hidden :

if (is_array($_POST['data'])){

$data = $_POST['data'];

} else {

$data = array();

}

var_dump($data);

Commentaires PHP :

On peut récupérer les données en bloc, sans devoir déclarer les indices actifs.

submit, versant HTML

Pour soumettre le formulaire :

Aperçu

submit, versant PHP

Le bouton submit du formulaire HTML lance le dépouillement PHP du formulaire.

Contact | Accueil > PHP