Attributs de formulaire HTML
Ce chapitre décrit les différents attributs de l' <form>élément HTML.
L'attribut d'action
L' actionattribut définit l'action à effectuer lorsque le formulaire est soumis.
Habituellement, les données du formulaire sont envoyées vers un fichier sur le serveur lorsque l'utilisateur clique sur le bouton Soumettre.
Dans l'exemple ci-dessous, les données du formulaire sont envoyées dans un fichier appelé "action_page.php". Ce fichier contient un script côté serveur qui gère les données du formulaire :
Exemple
Lors de la soumission, envoyez les données du formulaire à "action_page.php":
<form action="/action_page.php">
<label for="fname">First
name:</label><br>
<input type="text" id="fname" name="fname"
value="John"><br>
<label for="lname">Last name:</label><br>
<input type="text" id="lname" name="lname" value="Doe"><br><br>
<input type="submit" value="Submit">
</form>
Conseil : Si l' actionattribut est omis, l'action est définie sur la page actuelle.
L'attribut cible
L' targetattribut spécifie où afficher la réponse reçue après la soumission du formulaire.
L' targetattribut peut avoir l'une des valeurs suivantes :
| Value | Description |
|---|---|
| _blank | The response is displayed in a new window or tab |
| _self | The response is displayed in the current window |
| _parent | The response is displayed in the parent frame |
| _top | The response is displayed in the full body of the window |
| framename | The response is displayed in a named iframe |
La valeur par défaut est _selfce 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 du navigateur :
<form action="/action_page.php" target="_blank">
L'attribut de méthode
L' methodattribut spécifie la méthode HTTP à utiliser lors de la soumission des données du formulaire.
Les données de formulaire peuvent être envoyées sous forme de variables URL (avec method="get") ou sous forme de transaction post HTTP (avec method="post").
La méthode HTTP par défaut lors de la soumission des données de 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, par 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 le résultat en signet
- 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 dans le corps de la requête HTTP (les données du formulaire soumises ne sont pas affichées dans l'URL)
- POST n'a pas de limite 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
Conseil : utilisez toujours POST si les données du formulaire contiennent des informations sensibles ou personnelles !
L'attribut de saisie semi-automatique
L' autocompleteattribut spécifie si un formulaire doit avoir la saisie semi-automatique activée ou désactivée.
Lorsque la saisie semi-automatique est activée, le navigateur complète automatiquement les valeurs en fonction des valeurs que l'utilisateur a saisies auparavant.
Exemple
Un formulaire avec saisie semi-automatique sur :
<form action="/action_page.php" autocomplete="on">
L'attribut Novalidate
L' novalidateattribut 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 lorsqu'elles sont soumises.
Exemple
Un formulaire avec un attribut novalidate :
<form action="/action_page.php" novalidate>
Exercices HTML
Liste de tous les attributs <form>
| Attribut | La 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 de formulaire lorsqu'un formulaire est soumis |
| Saisie automatique | Spécifie si un formulaire doit avoir la saisie semi-automatique 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") |
| méthode | Spécifie la méthode HTTP à utiliser lors de l'envoi de données de formulaire |
| Nom | Spécifie le nom du formulaire |
| non valider | Spécifie que le formulaire ne doit pas être validé lors de sa soumission |
| rel | Spécifie la relation entre une ressource liée et le document actuel |
| cibler | Indique où afficher la réponse reçue après la soumission du formulaire |