L'élémentHTML<form> représente une section du document contenant des contrôles interactifs permettant de soumettre des informations.

Exemple interactif

<form action="" method="get">  <div>    <label for="name">Entrez votre nom&nbsp;: </label>    <input type="text" name="name" required />  </div>  <div>    <label for="email">Entrez votre e-mail&nbsp;: </label>    <input type="email" name="email" required />  </div>  <div>    <input type="submit" value="S'abonner !" />  </div></form>

form.form-example {  display: table;}div.form-example {  display: table-row;}label,input {  display: table-cell;  margin-bottom: 10px;}label {  padding-right: 10px;}

Il est possible d'utiliser lespseudo-classes CSS:valid et:invalid pour mettre en forme un élément<form> selon que le contenu deselements du formulaire est valide ou non.

Attributs

Cet élément inclut lesattributs universels.

acceptObsolète

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

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

accept-charset

L'encodage de caractères accepté par le serveur.La spécification autorise une seule valeur insensible à la casse"UTF-8", reflétant l'omniprésence de cet encodage (historiquement, plusieurs encodages de caractères pouvaient être définis sous forme de liste séparée par des virgules ou par des espaces).

autocapitalize

Contrôle la mise en majuscules automatique du texte saisi et, le cas échéant, la manière dont elle s'effectue. Voir la page de l'attribut universelautocapitalize pour plus d'informations.

autocomplete

Indique si, par défaut, les éléments d'entrée peuvent voir leurs valeurs complétées automatiquement par le navigateur. Les attributsautocomplete appliqués aux éléments du formulaire remplacent celui défini sur le<form>. Valeurs possibles :

• off : Le navigateur peut ne pas compléter automatiquement les saisies. (Les navigateurs ont tendance à ignorer ce réglage pour les formulaires de connexion suspects ; voirGérer l'autocomplétion pour les champs de connexion.)
• on : Le navigateur peut compléter automatiquement les saisies.

name

Le nom du formulaire. La valeur ne doit pas être une chaîne vide et doit être unique parmi les élémentsform de la collection de formulaires à laquelle il appartient, le cas échéant. Le nom devient une propriété des objetsWindow,Document etdocument.forms, contenant une référence à l'élément formulaire.

rel

Contrôle les annotations et les types de liens créés par le formulaire. Les annotations incluentexternal,nofollow,opener,noopener etnoreferrer. Les types de liens incluenthelp,prev,next,search etlicense. La valeur derel est une liste d'espaces de ces valeurs énumérées.

Attributs pour l'envoi de formulaires

Les attributs suivants contrôlent le comportement pendant l'envoi du formulaire.

action

L'URL qui traite l'envoi du formulaire. Cette valeur peut être remplacée par un attributformaction sur un<button>,<input type="submit">, ou<input type="image">. Cet attribut est ignoré lorsquemethod="dialog" est défini.

enctype

Lorsque la valeur de l'attributmethod estpost, cet attribut définit letype 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> avec l'attributtype="file".
• text/plain : utilisé à des fins de débogage.

Cette valeur peut être remplacée par un attributformenctype sur un<button>,<input type="submit">, ou<input type="image">.

method

Cet attribut définit la méthodeHTTP qui sera utilisée pour envoyer les données au serveur.C'est un attribut énuméré qui peut prendre les valeurs suivantes (non sensibles à la casse) :

• post : La méthodePOST ; données du formulaire envoyées commecorps de la requête.
• get : La méthodeGET ; données du formulaire annexées à l'URLaction avec un séparateur?. Utilisez cette méthode lorsque le formulairen'a pas d'effets secondaires.
• dialog : Lorsque le formulaire se trouve à l'intérieur d'un<dialog>, ferme la boîte de dialogue à la soumission.

Si cet attribut n'est pas défini, la valeur par défaut utilisée estget. Cette valeur peut-être remplacée par un attributformmethod sur un<button>,<input type="submit"> ou<input type="image">.

novalidate

Cet attribut booléen indique que le formulaire ne doit pas être validé lors de sa soumission. Si cet attribut n'est pas défini (et que le formulaire est donc validé), il peut être remplacé par un attributformnovalidate sur un<button>,<input type="submit"> ou<input type="image"> appartenant au formulaire.

target

Indique où afficher la réponse après l'envoi du formulaire. C'est un nom/mot-clé pour uncontexte de navigation (par exemple : onglet, fenêtre ou iframe). Les mots-clés suivants ont des significations particulières :

• _self (par défaut) : Charger dans le même contexte de navigation que le contexte actuel.
• _blank : Charger dans un nouveau contexte de navigation sans nom. Cela a le même comportement que de définirrel="noopener" et ne définit paswindow.opener.
• _parent : Charger dans le contexte de navigation parent du contexte actuel. S'il n'y a pas de parent, il se comporte de la même manière que_self.
• _top : Charger dans le contexte de navigation de niveau supérieur (c'est‑à‑dire le contexte de navigation qui est un ancêtre du contexte actuel et qui n'a pas de parent). S'il n'y a pas de parent, il se comporte de la même manière que_self.
• _unfencedTop : Charge la réponse d'un formulaire situé à l'intérieur d'uncadre sécurisé dans la fenêtre de niveau supérieur (c'est‑à‑dire en traversant au‑delà de la racine de la fenced frame, contrairement aux autres destinations réservées). Disponible uniquement à l'intérieur des fenced frames.

Cette valeur peut être remplacée par un attributformtarget sur un<button>,<input type="submit">, ou<input type="image">.

Exemples

HTML

<!-- Formulaire simple qui enverra une requête GET --><form>  <label    >Nom&nbsp;:    <input name="submitted-name" autocomplete="name" />  </label>  <button>Sauvegarder</button></form><!-- Formulaire qui enverra une requête POST à l'URL actuelle --><form method="post">  <label    >Nom&nbsp;:    <input name="submitted-name" autocomplete="name" />  </label>  <button>Sauvegarder</button></form><!-- Formulaire avec un ensemble de champs, une légende et une étiquette --><form method="post">  <fieldset>    <legend>Titre</legend>    <label><input type="radio" name="radio" />Sélectionnez-moi</label>  </fieldset></form>

Résultat

Résumé technique

Spécifications

Compatibilité des navigateurs

Voir aussi

• Guide des formulaires HTML
• D'autres éléments qui sont utilisés lors de la création de formulaires :<button>,<datalist>,<fieldset>,<input>,<label>,<legend>,<meter>,<optgroup>,<option>,<output>,<progress>,<select>,<textarea>.
• Obtenir une liste des éléments du formulaire :HTMLFormElement.elements
• ARIA : rôleform
• ARIA : rôlesearch