Balises de formulaire

`form` + attributs

Définition: Délimite un formulaire.

Attributs importants:

action: URL de destination des données du formulaire.
method: Méthode d’envoi des données (GET ou POST).

Exemple:

<form action="traitement.php" method="post">
  ...
</form>

`fieldset` & `legend`

Définition: Groupe un ensemble de champs de formulaire.

Exemple:

<form action="traitement.php" method="post">
<fieldset>
  <legend>Informations personnelles</legend>
  <label for="nom">Nom:</label>
  <input type="text" id="nom" name="nom">
  <label for="email">Adresse email:</label>
  <input type="email" id="email" name="email">
</fieldset>
</form>

`label`

Définition: Associe un texte à un champ de formulaire.

Attribut important:

for: Identifiant du champ de formulaire associé.

Exemple voir ci-dessus

`input` type `text` et les attributs html

Définition: Crée un champ de texte.

Attributs importants:

id: Identifiant unique du champ.
name: Nom du champ pour la récupération des données.
placeholder: Texte d’aide affiché dans le champ.
required : Défini si le champ est requis
disabled : Défini si le champ est désactivé

<form action="traitement.php" method="post">
<label for="nom">Votre nom:</label>
<input id="nom" name="nom" placeholder="Votre nom">
</form>

`input` ou `button` type `submit`

Définition: Bouton d’envoi du formulaire.

Exemple:

<form action="traitement.php" method="post">
<label for="nom">Votre nom:</label>
<input id="nom" name="nom" placeholder="Votre nom">
<input type="submit" value="Envoyer"> 
<!-- <button type="submit">Envoyer</button> -->
</form>

`input` type `email`

Définition: Crée un champ de saisie d’adresse email.

Exemple:

<form action="traitement.php" method="post">
 <label for="email">Votre email:</label>
 <input type="email" id="email" name="email">
</form>

`input` type `number`

Définition: Crée un champ de saisie de nombre.

Exemple:

<form action="traitement.php" method="post">
 <label for="age">Votre âge:</label>
 <input type="number" id="age" name="age">
</form>

`input` type `range`

Définition: Crée un curseur de sélection de valeur.

Exemple:

<form action="traitement.php" method="post">
 <label for="volume">Volume:</label>
 <input type="range" id="volume" name="volume" min="0" max="100">
...
</form>

`input` type `checkbox`

Définition: Crée une case à cocher. L’attribut name doit être identique

Exemple:

<form action="traitement.php" method="post">
 <label for="bike">Vélo</label>
 <input type="checkbox" id="bike" name="interest[]" value="bike">
 <label for="snowboard">Snowboard</label>
 <input type="checkbox" id="snowboard" name="interest[]" value="snowboard">
 <label for="jumping_rope">Corde à sauter</label>
 <input type="checkbox" id="jumping_rope" name="interest[]" value="jumping_rope">
...
</form>

`input` type `radio`

Définition: Crée une case à cocher. L’attribut name doit être identique

Exemple:

<form action="traitement.php" method="post">
 <label for="homme">Homme</label>
 <input type="radio" id="homme" name="gender" value="male">
 <label for="femme">Femme</label>
 <input type="radio" id="femme" name="gender" value="female">
 <label for="non_defini">Non binaire</label>
 <input type="radio" id="non_defini" name="gender" value="no_binary">
...
</form>

`select` et `option`

Définition: Crée une liste déroulante.

Exemple:

<form action="traitement.php" method="post">
 <select id="pays" name="pays">
  <option value="france">France</option>
  <option value="suisse">Suisse</option>
  <option value="portugal">Portugal</option>
  <option value="argentine">Argentine</option>
  ...
</select>
</form>

`textarea`

Définition: Crée un champ de texte multiligne.

Exemple:

<form action="traitement.php" method="post">
 <label for="message">Votre message:</label>
<textarea id="message" name="message" placeholder="Écrivez votre message ici"></textarea>
</form>

Récupération des données

Pour accéder aux données envoyées, il faut utiliser la variable superglobale $_POST

Chaque champ du formulaire est accessible par son nom (ex: $_POST['nom'], $_POST['email']).
Traiter les données récupérées (validation, stockage, etc.).

Exemple :

<?php
// Récupération des données
$nom = $_POST['nom'];
$email = $_POST['email'];

// Traitement des données
// ...

// Afficher les données
echo "Nom : $nom";
echo "<br>";
echo "Email : $email";
?>

$_POST est un tableau associatif.
Les noms des champs du formulaire doivent être uniques.
Sécuriser les données avant de les traiter (ex: injection SQL).

Exercices

#1 Formulaire basique

Créer un formulaire avec nom prénom émail
Afficher les données dans la page traitement

#2 Formulaire de contact

Ajouter un champ pour le sujet et un champ de texte pour le message
Afficher un résumé dans la page traitement
Envoyer un mail avec la fonction php mail

PHP CPMD