<form>

L'élément HTML <form> représente une section d'un document qui contient des contrôles interactifs permettant à un utilisateur d'envoyer des données à un serveur web.

Le code source de cet exemple interactif est disponible dans un dépôt GitHub. Si vous souhaitez contribuez à ces exemples, n'hésitez pas à cloner https://github.com/mdn/interactive-examples et à envoyer une pull request !

Il est possible d'utiliser les pseudo-classes CSS :valid et :invalid pour mettre en forme un élément <form>.

Attributs

Cet élément prend en charge les attributs universels.

accept HTML 4

Cet attribut indique quels types de contenus sont acceptés par le serveur. Il peut y en avoir plusieurs, séparés par des virgules.

Note d'utilisation : Cet attribut a été retiré dans HTML5 et ne doit plus être utilisé. À la place, il faut utiliser l'attribut accept de l'élément <input>.

accept-charset

Une liste des ensembles de caractères que le serveur accepte. Cette liste est délimitée par des espaces ou des virgules. Le navigateur les utilise dans l'ordre dans lequel ils ont été définis. La valeur par défaut est la chaîne de caractères réservée "UNKNOWN" ; dans ce cas, l'ensemble de caractères utilisé correspond à celui du document contenant l'élément <form>.
Dans les versions précédentes de HTML, les différents ensembles de caractères pouvaient être délimités par des espaces ou des virgules. Ce n'est plus le cas en HTML5 où seuls les espaces sont autorisés.

action

L'URI du programme qui traitera les informations soumises par le formulaire. Cette valeur peut être surchargée par un attribut formaction sur un élément <button> ou <input>.

autocapitalize

Cet attribut est un attribut non-standard utilisé sur iOS par Safari Mobile qui contrôle la façon dont la valeur du texte est automatiquement transcrite en majuscules lors de la saisie par l'utilisateur. Si l'attribut autocapitalize est défini sur un des descendants du formulaire, il surchargera la valeur de autocapitalize utilisée pour le formulaire. Les valeurs non-dépréciées sont disponibles pour iOS 5 et supérieurs. La valeur par défaut est sentences. Les valeurs possibles sont:

• none : La mise en majuscules est totalement désactivée
• sentences : Les premières lettres des phrases sont automatiquement passées en majuscules.
• words : La première lettre de chaque mot est automatiquement passée en majuscule.
• characters : Tous les caractères sont automatiquement passés en majuscules.
• on : Déprécié depuis iOS 5.
• off : Déprécié depuis iOS 5.

autocomplete HTML5

Cet attribut énuméré est utilisé pour définir le comportement du navigateur quant à l'autocomplétion des champs. Cet attribut peut être surchargé par chacun des éléments du formulaire. Il peut prendre deux valeurs :

• on : Le navigateur peut remplir automatiquement les valeurs d'après les précédentes informations qu'a entrées l'utilisateur lors d'usages antérieurs du formulaire.
• off : L'utilisateur doit remplir lui-même la valeur de chaque champ, à chaque utilisation du formulaire, ou le formulaire utilise son propre système d'auto-complétion ; le navigateur ne doit pas remplir automatiquement les valeurs.

En son absence, sa valeur par défaut est on. Les éléments du formulaire peuvent bien sûr outrepasser cette valeur via leur propre attribut autocomplete.

Note : Si autocomplete vaut off dans un formulaire parce que le document fournit son propre système d'auto-complétion, il faut aussi définir autocomplete à off pour chaque élément <input> du formulaire. Pour plus d'informations, voir le tableau de compatibilité.

enctype

Lorsque la valeur de l'attribut method est post, cet attribut définit le type MIME qui sera utilisé pour encoder les données envoyées au serveur. C'est un attribut énuméré qui peut prendre les valeurs suivantes :

• application/x-www-form-urlencoded : la valeur par défaut si l'attribut n'est pas défini
• multipart/form-data : la valeur utilisée par un élément <input> dont l'attribut type vaut "file".
• text/plain HTML5, correspondant au type MIME éponyme.

Cette valeur peut être surchargée par l'attribut formenctype des éléments <button> ou <input>.

method

Cet attribut définit la méthode HTTP qui sera utilisée pour envoyer les données au serveur. C'est un attribut énuméré qui peut prendre les valeurs suivantes :

• get : correspondant à la méthode GET du protocole HTTP. Les données du formulaires sont ajoutées à l'URI de l'attribut action avec '?' comme séparateur. L'URI ainsi composée est ensuite enovyée vers le serveur. On utilisera cette méthode lorsque le formulaire n'a pas d'effet de bord et qu'il ne contient que des caractères ASCII.
• post : correspondant à la méthode POST du protocole HTTP, les données du formulaires sont incluses dans le corps du formulaire et envoyées vers le server.

Si cet attribut n'est pas défini, la valeur par défaut utilisée est get. Cette valeur peut-être surchargée par l'attribut formmethod des éléments <button> ou <input>.

name

Le nom du formulaire. Dans HTML 4, cet attribut est déprécié. (id doit être utilisé à la place). Il doit être unique parmi tous les formulaires d'un document, et ne doit pas être une chaîne de caractères vide en HTML5.

novalidate HTML5

Cet attribut booléen indique si le formulaire doit être validé au moment de sa soumission. S'il n'est pas défini, le formulaire sera validé lors de sa soumission. Il peut être surchargé par l'attribut formnovalidate des éléments  <button> ou <input> appartenant au formulaire.

target

Un nom ou un mot-clé indiquant où afficher la réponse après avoir envoyé le formulaire. Dans HTML 4, c'est le nom, ou le mot-clé, d'une frame. Dans HTML5, c'est le nom, ou le mot-clé, d'un contexte de navigation (onglet, fenêtre, frame). Les mots-clés suivants ont un sens particulier :

• _self : charge la réponse dans la même frame HTML 4 (ou le même contexte de navigation HTML5) que l'actuelle. Il s'agit de la valeur par défaut quand cet attribut n'est pas défini ;
• _parent : charge la réponse dans le frameset parent HTML 4 de la frame actuelle, ou dans le contexte de navigation parent HTML5 de l'actuelle ;
• _top : HTML 4 : charge la réponse dans la fenêtre complête originale, annulant toutes les autres frames. HTML5 : charge la réponse dans le contexte de navigation le plus haut (c'est-à-dire le contexte de navigation qui est l'ancêtre de l'actuel, et qui n'a aucun parent). S'il n'y a pas de parent, l'option se comporte comme _self ;
• _blank : charge la réponse dans une fenêtre HTML 4 non nommée ou dans un contexte de navigation HTML5.

HTML5 : Cette valeur peut être surchargée par l'attribut formtarget des éléments <button> ou <input>.

Exemples

HTML

<!-- Formulaire simple qui enverra une requête GET -->
<form action="" method="get">
  <label for="GET-name">Nom :</label>
  <input id="GET-name" type="text" name="name">
  <input type="submit" value="Enregistrer">
</form>

<!-- Formulaire simple qui enverra une requête POST -->
<form action="" method="post">
  <label for="POST-name">Nom :</label>
  <input id="POST-name" type="text" name="name">
  <input type="submit" value="Enregistrer">
</form>

<!-- Formulaire avec un fieldset, un legend, et un label -->
<form action="" method="post">
  <fieldset>
    <legend>Titre</legend>
    <input type="radio" name="radio" id="radio"> <label for="radio">Cliquez moi</label>
  </fieldset>
</form>

Résultat

Spécifications

Compatibilité des navigateurs

Voir aussi

• Le guide sur les formulaires HTML
• Les autres éléments utilisés pour les formulaires
  • <button>
  • <datalist>
  • <fieldset>
  • <input>
  • <keygen>
  • <label>
  • <legend>
  • <meter>
  • <optgroup>
  • <option>
  • <output>
  • <progress>
  • <select>
  • <textarea>
• La méthode du DOM HTMLFormElement.elements qui permet de récupérer une liste des éléments du formulaire.