Les formulaires en HTML5
Les formulaires en HTML5
-
Objectifs
- Connaitre les éléments qui composent un formulaire en PHP
-
Présentation
- Les formulaires introduits dans le HTML depuis ses plus anciennes versions sont l’élément essentiel qui permet l’interactivité entre un site et ses visiteurs, Ils constituent pour cette raison la base de la création de sites dynamiques.
- L’envoi d’informations du poste client vers le serveur via le protocole HTTP concerne aussi bien l’envoi des données personnelles d’un internaute qui souhaite passer une commande que le déclenchement d’une requête dans une base de données ou la création de page dynamique en réponse à cette demande.
- Tout échange entre visiteur et serveur passe par un formulaire, dans lequel l’utilisateur peut saisir textes ou mots de passe, opérer des choix grâce à des boutons radio, des cases à cocher ou des listes de sélection, voire envoyer ses propres fichiers depuis le poste client.
- Il est donc important d’en maîtriser la création à la fois avec HTML 5, pour obtenir des formulaires présentables, et avec PHP, pour gérer les informations fournies par le formulaire au script côté serveur.
-
Création d’un formulaire HTML
- Pour être conforme au HTML5, le document contenant le formulaire doit avoir la structure minimale suivante :
- L’élément
<form>possède certains attributs obligatoires et facultatifs. L’attribut action="nom_de_fichier.php":
Il est obligatoire.- Il désigne le fichier qui sera traité sur le serveur.
- Il est recommandé que ce fichier soit présent dans le même répertoire que celui contenant le formulaire, mais ce n’est pas obligatoire, dans ce cas il faut utiliser une adresse absolue comme :action= « http://www.funhtml.com/dossier/nom_de_fichier.php ».
- Pour plus d’information sur l’élément <form> lire notre article l’élément <form> d’un formulaire
L’élément <fieldset>permet, à l’intérieur d’un même formulaire, de créer des blocs visuels contenus entre les balises<fieldset>et</fieldset>et donc de structurer le formulaire en fonction des champs qu’il contient, ce qui améliore la présentation.L’élément <legend>contient le titre de chacun de ces blocs. À l’intérieur de chaque bloc se trouvent les éléments HTML qui créent les champs visibles ou invisibles du formulaire.-
Application
-
Reproduire le formulaire suivant:
-
Description de l’image
- Trois fieldset avec trois légendes
- Zones de saisie des données personnelles du visiteur dans une zone de texte pour le nom et le prénom
- Date de naissance avec le composant date
- Un composant email
- Champ de saisie qui n’accepte que des adresses des sites web
- Champ de saisie de code par un nombre
- Deux boutons radio pour le genre de visiteur
- Trois cases à cocher
- Zone de texte multi-ligne
- Envoi d’un fichier du client vers le serveur
- Champ caché contenant la taille maximale des fichiers transférables
- Bouton de réinitialisation
- Bouton d’envoi
-
ِCorrection
- Références:
- https://www.php.net
- Livre PHP7 Cours et exercices Jean Engels 2e édition
- Technologies de l’Information et de la Communication 4 année secondaire
