HTML Attributs de Formulaire
Ce chapitre décrit les différents attributs de l'élément HTML <form> .
L'Attribut Action
L'attribut action définit l'action à effectuer lorsque le formulaire est soumis.
En général, les données du formulaire sont envoyées à un fichier sur le serveur lorsque l'utilisateur clique sur le bouton de soumission.
Dans l'exemple ci-dessous, les données du formulaire sont envoyées à un fichier appelé "action_page.php". Ce fichier contient un script côté serveur qui gère les données du formulaire :
Exemple
À la soumission, envoyez les données du formulaire à "action_page.php" :
<form action="/action_page.php">
<label for="fname">Prénom:</label><br>
<input type="text" id="fname" name="fname" value="John"><br>
<label for="lname">Nom de famille:</label><br>
<input type="text" id="lname" name="lname" value="Doe"><br><br>
<input type="submit" value="Soumettre">
</form> Astuce : Si l'attribut action est omis, l'action est définie sur la page actuelle.
L'Attribut Target
L'attribut target spécifie où afficher la réponse reçue après la soumission du formulaire.
L'attribut target peut avoir l'une des valeurs suivantes :
| Valeur | Description |
|---|---|
| _blank | La réponse est affichée dans une nouvelle fenêtre ou un nouvel onglet |
| _self | La réponse est affichée dans la fenêtre actuelle |
| _parent | La réponse est affichée dans le cadre parent |
| _top | La réponse est affichée dans l'intégralité du corps de la fenêtre |
| nom_du_cadre | La réponse est affichée dans un iframe nommé |
La valeur par défaut est _self , ce qui signifie que la réponse s'ouvrira dans la fenêtre actuelle.
Exemple
Ici, le résultat soumis s'ouvrira dans un nouvel onglet de navigateur :
<form action="/action_page.php" target="_blank"> L'Attribut Method
L'attribut method spécifie la méthode HTTP à utiliser lors de la soumission des données du formulaire.
Les données du formulaire peuvent être envoyées en tant que variables d'URL (avec method="get" ) ou en tant que transaction HTTP POST (avec method="post" ).
La méthode HTTP par défaut lors de la soumission des données du formulaire est GET.
Exemple
Cet exemple utilise la méthode GET lors de la soumission des données du formulaire :
<form action="/action_page.php" method="get"> Exemple
Cet exemple utilise la méthode POST lors de la soumission des données du formulaire :
<form action="/action_page.php" method="post"> Remarques sur GET :
- Ajoute les données du formulaire à l'URL, sous forme de paires nom/valeur
- N'UTILISEZ JAMAIS GET pour envoyer des données sensibles ! (les données du formulaire soumis sont visibles dans l'URL !)
- La longueur d'une URL est limitée (2048 caractères)
- Utile pour les soumissions de formulaires où un utilisateur souhaite mettre en signet le résultat
- GET est bon pour les données non sécurisées, comme les chaînes de requête dans Google
Remarques sur POST :
- Ajoute les données du formulaire à l'intérieur du corps de la requête HTTP (les données du formulaire soumis ne sont pas affichées dans l'URL)
- POST n'a pas de limitations de taille et peut être utilisé pour envoyer de grandes quantités de données.
- Les soumissions de formulaires avec POST ne peuvent pas être mises en signet
Astuce : Utilisez toujours POST si les données du formulaire contiennent des informations sensibles ou personnelles !
L'Attribut Autocomplete
L'attribut autocomplete spécifie si un formulaire doit avoir l'autocomplétion activée ou désactivée.
Lorsque l'autocomplétion est activée, le navigateur complète automatiquement les valeurs en fonction des valeurs que l'utilisateur a saisies auparavant.
Exemple
Un formulaire avec l'autocomplétion activée :
<form action="/action_page.php" autocomplete="on"> L'Attribut Novalidate
L'attribut novalidate est un attribut booléen.
Lorsqu'il est présent, il spécifie que les données du formulaire (entrée) ne doivent pas être validées lors de la soumission.
Exemple
Un formulaire avec un attribut novalidate :
<form action="/action_page.php" novalidate> Liste de Tous les Attributs <form>
| Attribut | Description |
|---|---|
| accept-charset | Spécifie les encodages de caractères utilisés pour la soumission du formulaire |
| action | Spécifie où envoyer les données du formulaire lorsqu'un formulaire est soumis |
| autocomplete | Spécifie si un formulaire doit avoir l'autocomplétion activée ou désactivée |
| enctype | Spécifie comment les données du formulaire doivent être encodées lors de leur soumission au serveur (uniquement pour method="post") |
| method | Spécifie la méthode HTTP à utiliser lors de l'envoi des données du formulaire |
| name | Spécifie le nom du formulaire |
| novalidate | Spécifie que le formulaire ne doit pas être validé lors de la soumission |
| rel | Spécifie la relation entre une ressource liée et le document actuel |
| target | Spécifie où afficher la réponse reçue après la soumission du formulaire |