Attributs de Formulaire HTML

Ce chapitre présente HTML <form> Différents attributs de l'élément.

Attribut Action

action Les attributs définissent l'opération à exécuter lors de la soumission du formulaire.

Généralement, lorsque l'utilisateur clique sur le bouton "Soumettre", les données du formulaire sont envoyées à un fichier sur le serveur.

Dans l'exemple suivant, les données du formulaire sont envoyées à un fichier nommé "action_page.php". Ce fichier contient un script serveur pour traiter les données du formulaire:

Exemple

Après soumission, les données du formulaire sont envoyées à "action_page.php":

<form action="/action_page.php">
  <label for="fname">Prénom:</label><br>
  <input type="text" id="fname" name="fname" value="Bill"><br>
  <label for="lname">Nom de famille:</label><br>
  <input type="text" id="lname" name="lname" value="Gates"><br><br>
  <input type="submit" value="Soumettre">
</form>

Essayer vous-même

Avis :Si l'attribut action est omis, l'action est définie sur la page actuelle.

Attribut Target

target L'attribut détermine où afficher la réponse après la soumission du formulaire.

target L'attribut peut être configuré avec l'une des valeurs suivantes :

Valeur Description
_blank La réponse s'affiche dans une nouvelle fenêtre ou un nouvel onglet.
_self La réponse s'affiche dans la fenêtre actuelle.
_parent La réponse s'affiche dans le cadre parent.
_top La réponse s'affiche dans tout le body de la fenêtre.
framename La réponse s'affiche dans l'iframe nommé.

La valeur par défaut est _self, ce qui signifie que la réponse s'ouvrira dans la fenêtre actuelle.

Exemple

Dans ce cas, le résultat de la soumission sera ouvert dans un nouvel onglet du navigateur :

<form action="/action_page.php" target="_blank">

Essayer vous-même

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 utilisées comme variables URL (en utilisant method="get") ou comme transaction HTTP POST (en utilisant method="post") est envoyé.

La méthode HTTP par défaut lors de la soumission des données du formulaire est GET.

Exemple

Dans cet exemple, la méthode GET est utilisée pour soumettre les données du formulaire :

<form action="/action_page.php" method="get">

Essayer vous-même

Exemple

Dans cet exemple, le méthode POST est utilisée pour soumettre les données du formulaire :

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

Essayer vous-même

Remarques sur GET :

  • Ajouter les données du formulaire sous forme de paires nom/valeur à l'URL
  • Ne jamais utiliser GET pour envoyer des données sensibles ! (Les données du formulaire soumis sont visibles dans l'URL !)
  • La longueur de l'URL est limitée (2048 caractères)
  • Très utile pour les soumissions de formulaires où l'utilisateur souhaite ajouter les résultats comme signet
  • GET est utilisé pour des données non sécurisées, telles que les chaînes de recherche dans Google

Remarques sur POST :

  • Ajouter les données du formulaire au corps de la requête HTTP (les données du formulaire soumis ne s'affichent pas dans l'URL)
  • POST n'a pas de limite de taille, il peut être utilisé pour envoyer de grandes quantités de données.
  • Les soumissions de formulaires avec POST ne peuvent pas ajouter de signets

Avis :Si les données du formulaire contiennent des informations sensibles ou personnelles, utilisez impérativement POST !

Attribut Autocomplete

autocomplete L'attribut détermine si le formulaire doit ouvrir la fonction de complétion automatique.

Après l'activation de la fonction de complétion automatique, le navigateur remplira automatiquement les valeurs en fonction des valeurs précédemment saisies par l'utilisateur.

Exemple

Activer le remplissage automatique des formulaires :

<form action="/action_page.php" autocomplete="on">

Essayer vous-même

Attribut Novalidate

novalidate L'attribut est un attribut booléen.

Si défini, il détermine que les données du formulaire ne doivent pas être vérifiées lors de la soumission.

Exemple

Formulaire sans attribut novalidate :

<form action="/action_page.php" novalidate>

Essayer vous-même

Liste de tous les attributs <form>

Attribut Description
accept-charset Définir le codage de caractères utilisé pour soumettre le formulaire.
action Définir où envoyer les données du formulaire lors de la soumission du formulaire.
autocomplete Définir si le formulaire doit ouvrir la fonction d'auto-complétion (remplissage) automatique.
enctype Définir comment encoder les données du formulaire lorsqu'elles sont envoyées au serveur (uniquement pour method="post").
method Définir la méthode HTTP à utiliser pour envoyer les données du formulaire.
name Définir le nom du formulaire.
novalidate Définir que le formulaire ne doit pas être vérifié lors de la soumission.
rel Définir la relation entre la ressource liée et le document courant.
target Définir où afficher la réponse reçue après soumission du formulaire.