From c05efa8d7ae464235cf83d7c0956e42dc6974103 Mon Sep 17 00:00:00 2001 From: julieng Date: Sat, 2 Oct 2021 17:20:14 +0200 Subject: move *.html to *.md --- .../api/htmlformelement/acceptcharset/index.html | 27 --- .../web/api/htmlformelement/acceptcharset/index.md | 27 +++ files/fr/web/api/htmlformelement/action/index.html | 26 --- files/fr/web/api/htmlformelement/action/index.md | 26 +++ .../fr/web/api/htmlformelement/elements/index.html | 31 --- files/fr/web/api/htmlformelement/elements/index.md | 31 +++ .../fr/web/api/htmlformelement/encoding/index.html | 10 - files/fr/web/api/htmlformelement/encoding/index.md | 10 + .../fr/web/api/htmlformelement/enctype/index.html | 26 --- files/fr/web/api/htmlformelement/enctype/index.md | 26 +++ files/fr/web/api/htmlformelement/index.html | 223 --------------------- files/fr/web/api/htmlformelement/index.md | 223 +++++++++++++++++++++ files/fr/web/api/htmlformelement/length/index.html | 29 --- files/fr/web/api/htmlformelement/length/index.md | 29 +++ files/fr/web/api/htmlformelement/method/index.html | 25 --- files/fr/web/api/htmlformelement/method/index.md | 25 +++ files/fr/web/api/htmlformelement/name/index.html | 32 --- files/fr/web/api/htmlformelement/name/index.md | 32 +++ .../api/htmlformelement/reportvalidity/index.html | 58 ------ .../api/htmlformelement/reportvalidity/index.md | 58 ++++++ files/fr/web/api/htmlformelement/reset/index.html | 28 --- files/fr/web/api/htmlformelement/reset/index.md | 28 +++ files/fr/web/api/htmlformelement/submit/index.html | 40 ---- files/fr/web/api/htmlformelement/submit/index.md | 40 ++++ .../api/htmlformelement/submit_event/index.html | 60 ------ .../web/api/htmlformelement/submit_event/index.md | 60 ++++++ files/fr/web/api/htmlformelement/target/index.html | 25 --- files/fr/web/api/htmlformelement/target/index.md | 25 +++ 28 files changed, 640 insertions(+), 640 deletions(-) delete mode 100644 files/fr/web/api/htmlformelement/acceptcharset/index.html create mode 100644 files/fr/web/api/htmlformelement/acceptcharset/index.md delete mode 100644 files/fr/web/api/htmlformelement/action/index.html create mode 100644 files/fr/web/api/htmlformelement/action/index.md delete mode 100644 files/fr/web/api/htmlformelement/elements/index.html create mode 100644 files/fr/web/api/htmlformelement/elements/index.md delete mode 100644 files/fr/web/api/htmlformelement/encoding/index.html create mode 100644 files/fr/web/api/htmlformelement/encoding/index.md delete mode 100644 files/fr/web/api/htmlformelement/enctype/index.html create mode 100644 files/fr/web/api/htmlformelement/enctype/index.md delete mode 100644 files/fr/web/api/htmlformelement/index.html create mode 100644 files/fr/web/api/htmlformelement/index.md delete mode 100644 files/fr/web/api/htmlformelement/length/index.html create mode 100644 files/fr/web/api/htmlformelement/length/index.md delete mode 100644 files/fr/web/api/htmlformelement/method/index.html create mode 100644 files/fr/web/api/htmlformelement/method/index.md delete mode 100644 files/fr/web/api/htmlformelement/name/index.html create mode 100644 files/fr/web/api/htmlformelement/name/index.md delete mode 100644 files/fr/web/api/htmlformelement/reportvalidity/index.html create mode 100644 files/fr/web/api/htmlformelement/reportvalidity/index.md delete mode 100644 files/fr/web/api/htmlformelement/reset/index.html create mode 100644 files/fr/web/api/htmlformelement/reset/index.md delete mode 100644 files/fr/web/api/htmlformelement/submit/index.html create mode 100644 files/fr/web/api/htmlformelement/submit/index.md delete mode 100644 files/fr/web/api/htmlformelement/submit_event/index.html create mode 100644 files/fr/web/api/htmlformelement/submit_event/index.md delete mode 100644 files/fr/web/api/htmlformelement/target/index.html create mode 100644 files/fr/web/api/htmlformelement/target/index.md (limited to 'files/fr/web/api/htmlformelement') diff --git a/files/fr/web/api/htmlformelement/acceptcharset/index.html b/files/fr/web/api/htmlformelement/acceptcharset/index.html deleted file mode 100644 index 59cf90bc64..0000000000 --- a/files/fr/web/api/htmlformelement/acceptcharset/index.html +++ /dev/null @@ -1,27 +0,0 @@ ---- -title: HTMLFormElement.acceptCharset -slug: Web/API/HTMLFormElement/acceptCharset -tags: - - HTMLFormElement -translation_of: Web/API/HTMLFormElement/acceptCharset ---- -
{{APIRef("HTML DOM")}}
- -

La propriété HTMLFormElement.acceptCharset représente une liste des codages de caratères acceptés par l'élément FORM concerné. Les valeurs de cette liste peuvent être séparés par des virgules ou des espaces.

- -

Syntaxe

- -
string = form.acceptCharset;
-form.acceptCharset = string;
-
- -

Exemple

- -
inputs = document.forms["myform"].acceptCharset
-
- -

Spécification

- -

HTML 5, Section 4.10.3: The Form Element

- -

DOM Level 2 HTML: acceptCharset

diff --git a/files/fr/web/api/htmlformelement/acceptcharset/index.md b/files/fr/web/api/htmlformelement/acceptcharset/index.md new file mode 100644 index 0000000000..59cf90bc64 --- /dev/null +++ b/files/fr/web/api/htmlformelement/acceptcharset/index.md @@ -0,0 +1,27 @@ +--- +title: HTMLFormElement.acceptCharset +slug: Web/API/HTMLFormElement/acceptCharset +tags: + - HTMLFormElement +translation_of: Web/API/HTMLFormElement/acceptCharset +--- +
{{APIRef("HTML DOM")}}
+ +

La propriété HTMLFormElement.acceptCharset représente une liste des codages de caratères acceptés par l'élément FORM concerné. Les valeurs de cette liste peuvent être séparés par des virgules ou des espaces.

+ +

Syntaxe

+ +
string = form.acceptCharset;
+form.acceptCharset = string;
+
+ +

Exemple

+ +
inputs = document.forms["myform"].acceptCharset
+
+ +

Spécification

+ +

HTML 5, Section 4.10.3: The Form Element

+ +

DOM Level 2 HTML: acceptCharset

diff --git a/files/fr/web/api/htmlformelement/action/index.html b/files/fr/web/api/htmlformelement/action/index.html deleted file mode 100644 index 7faeadc67a..0000000000 --- a/files/fr/web/api/htmlformelement/action/index.html +++ /dev/null @@ -1,26 +0,0 @@ ---- -title: HTMLFormElement.action -slug: Web/API/HTMLFormElement/action -translation_of: Web/API/HTMLFormElement/action ---- -
{{APIRef("HTML DOM")}}
- -

La propriété HTMLFormElement.action représente l'action associée à l'élément {{HTMLElement("form")}}.

- -

L'action d'un formulaire est le programme exécuté sur le serveur lorsque le formulaire est soumis. Cette propriété peut être récupérée ou définie.

- -

Syntaxe

- -
string = form.action
-form.action = string
-
- -

Exemple

- -

form.action = "/cgi-bin/publish";

- -

Spécification

- -

HTML 5, Section 4.10.19.6, Form submission

- -

DOM Level 2 HTML: action

diff --git a/files/fr/web/api/htmlformelement/action/index.md b/files/fr/web/api/htmlformelement/action/index.md new file mode 100644 index 0000000000..7faeadc67a --- /dev/null +++ b/files/fr/web/api/htmlformelement/action/index.md @@ -0,0 +1,26 @@ +--- +title: HTMLFormElement.action +slug: Web/API/HTMLFormElement/action +translation_of: Web/API/HTMLFormElement/action +--- +
{{APIRef("HTML DOM")}}
+ +

La propriété HTMLFormElement.action représente l'action associée à l'élément {{HTMLElement("form")}}.

+ +

L'action d'un formulaire est le programme exécuté sur le serveur lorsque le formulaire est soumis. Cette propriété peut être récupérée ou définie.

+ +

Syntaxe

+ +
string = form.action
+form.action = string
+
+ +

Exemple

+ +

form.action = "/cgi-bin/publish";

+ +

Spécification

+ +

HTML 5, Section 4.10.19.6, Form submission

+ +

DOM Level 2 HTML: action

diff --git a/files/fr/web/api/htmlformelement/elements/index.html b/files/fr/web/api/htmlformelement/elements/index.html deleted file mode 100644 index fbe30d563e..0000000000 --- a/files/fr/web/api/htmlformelement/elements/index.html +++ /dev/null @@ -1,31 +0,0 @@ ---- -title: HTMLFormElement.elements -slug: Web/API/HTMLFormElement/elements -translation_of: Web/API/HTMLFormElement/elements ---- -
-
{{APIRef("HTML DOM")}}
-
- -

La propriété HTMLFormElement.elements retourne une {{domxref("HTMLFormControlsCollection")}} ({{ HTMLVersionInline(4) }} HTMLCollection) de tous les contrôles de formulaire contenu dans l'élément FORM, à l'exception des éléments de type input dont l'attribut type est égal à image.

- -

Vous pouvez accéder à un élément particulier en utilisant soit un index soit le name ou l'id de l'élément.

- -

Syntaxe

- -
nodeList = HTMLFormElement.elements
-
- -

Exemple

- -
var inputs = document.getElementById("form1").elements;
-var inputByIndex = inputs[2];
-var inputByName = inputs["login"];
-
- -

Spécification

- - diff --git a/files/fr/web/api/htmlformelement/elements/index.md b/files/fr/web/api/htmlformelement/elements/index.md new file mode 100644 index 0000000000..fbe30d563e --- /dev/null +++ b/files/fr/web/api/htmlformelement/elements/index.md @@ -0,0 +1,31 @@ +--- +title: HTMLFormElement.elements +slug: Web/API/HTMLFormElement/elements +translation_of: Web/API/HTMLFormElement/elements +--- +
+
{{APIRef("HTML DOM")}}
+
+ +

La propriété HTMLFormElement.elements retourne une {{domxref("HTMLFormControlsCollection")}} ({{ HTMLVersionInline(4) }} HTMLCollection) de tous les contrôles de formulaire contenu dans l'élément FORM, à l'exception des éléments de type input dont l'attribut type est égal à image.

+ +

Vous pouvez accéder à un élément particulier en utilisant soit un index soit le name ou l'id de l'élément.

+ +

Syntaxe

+ +
nodeList = HTMLFormElement.elements
+
+ +

Exemple

+ +
var inputs = document.getElementById("form1").elements;
+var inputByIndex = inputs[2];
+var inputByName = inputs["login"];
+
+ +

Spécification

+ + diff --git a/files/fr/web/api/htmlformelement/encoding/index.html b/files/fr/web/api/htmlformelement/encoding/index.html deleted file mode 100644 index 43c942335d..0000000000 --- a/files/fr/web/api/htmlformelement/encoding/index.html +++ /dev/null @@ -1,10 +0,0 @@ ---- -title: HTMLFormElement.encoding -slug: Web/API/HTMLFormElement/encoding -translation_of: Web/API/HTMLFormElement/encoding ---- -
-
{{APIRef("HTML DOM")}}
-
- -

La propriété HTMLFormElement.encoding est un nom alternatif pour l'élément {{domxref("HTMLFormElement.enctype","enctype")}} de l'objet {{domxref("HTMLFormElement")}} du DOM.

diff --git a/files/fr/web/api/htmlformelement/encoding/index.md b/files/fr/web/api/htmlformelement/encoding/index.md new file mode 100644 index 0000000000..43c942335d --- /dev/null +++ b/files/fr/web/api/htmlformelement/encoding/index.md @@ -0,0 +1,10 @@ +--- +title: HTMLFormElement.encoding +slug: Web/API/HTMLFormElement/encoding +translation_of: Web/API/HTMLFormElement/encoding +--- +
+
{{APIRef("HTML DOM")}}
+
+ +

La propriété HTMLFormElement.encoding est un nom alternatif pour l'élément {{domxref("HTMLFormElement.enctype","enctype")}} de l'objet {{domxref("HTMLFormElement")}} du DOM.

diff --git a/files/fr/web/api/htmlformelement/enctype/index.html b/files/fr/web/api/htmlformelement/enctype/index.html deleted file mode 100644 index d706eec625..0000000000 --- a/files/fr/web/api/htmlformelement/enctype/index.html +++ /dev/null @@ -1,26 +0,0 @@ ---- -title: HTMLFormElement.enctype -slug: Web/API/HTMLFormElement/enctype -translation_of: Web/API/HTMLFormElement/enctype ---- -
{{APIRef("HTML DOM")}}
- -

La propriété HTMLFormElement.enctype représente le type de contenu de l'élément  {{HTMLElement("form")}}.

- -

Le type d'encodage généralement utilisé est "application/x-www-form-urlencoded".

- -

Syntaxe

- -
string = form.enctype
-form.enctype = string
-
- -

Exemple

- -
form.enctype = "application/x-www-form-urlencoded";
- -

Spécification

- -

HTML 5, Section 4.10.19.6, Form submission

- -

DOM Level 2 HTML: enctype

diff --git a/files/fr/web/api/htmlformelement/enctype/index.md b/files/fr/web/api/htmlformelement/enctype/index.md new file mode 100644 index 0000000000..d706eec625 --- /dev/null +++ b/files/fr/web/api/htmlformelement/enctype/index.md @@ -0,0 +1,26 @@ +--- +title: HTMLFormElement.enctype +slug: Web/API/HTMLFormElement/enctype +translation_of: Web/API/HTMLFormElement/enctype +--- +
{{APIRef("HTML DOM")}}
+ +

La propriété HTMLFormElement.enctype représente le type de contenu de l'élément  {{HTMLElement("form")}}.

+ +

Le type d'encodage généralement utilisé est "application/x-www-form-urlencoded".

+ +

Syntaxe

+ +
string = form.enctype
+form.enctype = string
+
+ +

Exemple

+ +
form.enctype = "application/x-www-form-urlencoded";
+ +

Spécification

+ +

HTML 5, Section 4.10.19.6, Form submission

+ +

DOM Level 2 HTML: enctype

diff --git a/files/fr/web/api/htmlformelement/index.html b/files/fr/web/api/htmlformelement/index.html deleted file mode 100644 index 747286a784..0000000000 --- a/files/fr/web/api/htmlformelement/index.html +++ /dev/null @@ -1,223 +0,0 @@ ---- -title: form -slug: Web/API/HTMLFormElement -tags: - - API - - Contrôles - - DOM - - Formulaire - - HTML - - Interface -translation_of: Web/API/HTMLFormElement ---- -
{{APIRef("HTML DOM")}}
- -

L'interface HTMLFormElement représente un élément  {{HTMLElement("form")}} dans le DOM ; il peut être utilisé pour accéder et, dans quelques cas, modifier l'aspect du formulaire, ainsi que pour accéder à ses éléments composants.

- -

{{InheritanceDiagram(600,120)}}

- -

Propriétés

- -

Cette interface hérite aussi des propriétés de son parent {{domxref("HTMLElement")}}.

- -
-
{{domxref("HTMLFormElement.elements")}}{{ReadOnlyInline}}
-
Un élément {{domxref("HTMLFormControlsCollection")}} regroupant les différents contrôles associés à ce formulaire.
-
{{domxref("HTMLFormElement.length")}}{{ReadOnlyInline}}
-
Une valeur de type long indiquant le nombre de contrôles dans le formulaire.
-
{{domxref("HTMLFormElement.name")}}
-
Une chaîne {{domxref("DOMString")}} indiquant la valeur de l'attribut HTML {{htmlattrxref("name", "form")}} pour ce formulaire et qui correspond au nom du formulaire.
-
{{domxref("HTMLFormElement.method")}}
-
Une chaîne {{domxref("DOMString")}} indiquant la valeur de l'attribut HTML {{htmlattrxref("method", "form")}} pour ce formulaire et qui correspond à la méthode HTTP utilisée pour envoyer le formulaires. Seules certaines valeurs peuvent être utilisées avec cette propriété.
-
{{domxref("HTMLFormElement.target")}}
-
Une chaîne {{domxref("DOMString")}} indiquant la valeur de l'attribut HTML {{htmlattrxref("target", "form")}} pour ce formulaire et qui indique l'emplacement où seront affichées les résultats après envoi du formulaire.
-
{{domxref("HTMLFormElement.action")}}
-
Une chaîne {{domxref("DOMString")}} indiquant la valeur de l'attribut HTML {{htmlattrxref("action", "form")}} pour ce formulaire et qui contient l'URI d'un programme traitant les informations transmises via le formulaire.
-
{{domxref("HTMLFormElement.encoding")}} ou {{domxref("HTMLFormElement.enctype")}}
-
Une chaîne {{domxref("DOMString")}} indiquant la valeur de l'attribut HTML {{htmlattrxref("enctype", "form")}} pour ce formulaire et qui correspond au type de contenu utilisé pour transmettre les données du formulaire vers le serveur. Seules certaines valeurs peuvent être utilisées pour cette propriété. Les deux noms indiqués pour la méthode sont synonymes.
-
{{domxref("HTMLFormElement.acceptCharset")}}
-
Une chaîne {{domxref("DOMString")}} indiquant la valeur de l'attribut HTML {{htmlattrxref("accept-charset", "form")}} pour ce formulaire et qui correspond au jeu de caractères / à l'encodage pris en charge par le serveur.
-
{{domxref("HTMLFormElement.autocomplete")}}
-
Une chaîne {{domxref("DOMString")}} indiquant la valeur de l'attribut HTML {{htmlattrxref("autocomplete", "form")}} pour ce formulaire et qui indique si les contrôles du formulaire sont automatiquement renseignés par le navigateur.
-
{{domxref("HTMLFormElement.noValidate")}}
-
Un booléen indiquant la valeur de l'attribut HTML {{htmlattrxref("novalidate", "form")}} pour ce formulaire et qui indique si le formulaire ne devrait pas être validé.
-
- -

Les champs de saisie nommés sont ajoutés comme propriétés sur leurs formulaires associés. Ces propriétés peuvent surcharger les propriétés natives si elles utilisent le même nom ! Par exemple, un formulaire disposant d'un {{HTMLElement("<input>")}} nommé action surchargera la propriété native action et tout appel renverra le champ input plutôt que la valeur de l'attribut HTML {{htmlattrxref("action", "form")}}.

- -

Méthodes

- -

Cette interface hérite aussi des méthodes de son parent {{domxref("HTMLElement")}}.

- -
-
{{domxref("HTMLFormElement.submit()")}}
-
soumet le formulaire au serveur.
-
{{domxref("HTMLFormElement.reset()")}}
-
redéfinit le formulaire à son état initial.
-
{{domxref("HTMLFormElement.checkValidity()")}}
-
renvoie true si les contrôles du formulaire sont soumis à des contraintes de validation et les respectent. Elle renvoie false si certains contrôles ne respectent pas leurs contraintes. Elle déclenche un évènement {{event("invalid")}} pour chaque contrôle qui ne respecte pas ses contraintes. De tels contrôles sont considérés invalides si l'évènement n'est pas annulé. C'est au développeur de choisir comment réagir face à la valeur false produite par cette méthode.
-
{{domxref("HTMLFormElement.reportValidity()")}}
-
renvoie true si les contrôles du formulaire respectent leurs contraintes de validation. Lorsque false est renvoyé, des évènements annulables {{Event("invalid")}} sont déclenchés pour chaque contrôle invalide et les problèmes de validation sont rapportés à l'utilisateur.
-
{{domxref("HTMLFormElement.requestAutocomplete()")}} {{obsolete_inline}}
-
déclenche une interface native du navigateur afin d'aider les utilisateurs à remplir les champs pour lesquels la valeur nommée du champ à remplissage automatique ne vaut pas off ou on. Le formulaire reçoit un évènement lorsque l'utilisateur a fini d'intéragir avec l'interface, l'événement sera {{event("autocomplete")}} si les champs ont bien été remplis ou {{event("autocompleteerror")}} s'il y a eu un problème. Cette méthode a été retirée de Chrome et Firefox — cf. {{bug(1270740)}} pour plus d'informations et les raisons associées.
-
- -

Notes d'utilisation

- -

Obtention d'un objet élément de formulaire

- -

Pour obtenir un objet HTMLFormElement, vous pouvez utiliser un sélecteur CSS avec {{domxref("ParentNode.querySelector", "querySelector()")}}  ou vous pouvez obtenir une liste de tous les formulaires du document utilisant sa propriété {{domxref("Document.forms", "forms")}}.

- -

{{domxref("Document.forms")}} renvoie un tableau des objets HTMLFormElement listant chacun des formulaires de la page. Vous pouvez utiliser alors l'une des syntaxes suivantes pour obtenir un formulaire individuel :

- -
-
document.forms[index]
-
renvoie le formulaire à l'index spécifié dans le tableau du formulaire.
-
document.forms[id]
-
renvoie le formulaire dont l'ID (identifiant) est id .
-
document.forms[name]
-
renvoie le formulaire dont la valeur d'attribut de {{domxref("Element.name", "name")}} est name.
-
- -

Accès aux éléments du formulaire

- -

Vous pouvez accéder à la liste des éléments contenant des données dans le formulaire en examinant la propriété {{domxref ("HTMLFormElement.elements", "elements")}}. Ceci retourne une {{domxref ("HTMLFormControlsCollection")}} listant tous les éléments d'entrée de données utilisateur du formulaire, aussi bien ceux qui sont des descendants du <form> que ceux déclarés membres du formulaire par leurs attributs.

- -

Éléments considérés comme des contrôles de formulaire

- -

Les éléments qui sont inclus par HTMLFormElement.elements et  HTMLFormElement.length sont :

- - - -

Exemples

- -

Crée un nouvel élément de formulaire, modifie ses attributs et l'envoie :

- -
var f = document.createElement("form"); // On crée un formulaire
-document.body.appendChild(f);           // On l'ajoute au corps du document
-f.action = "/cgi-bin/some.cgi";         // On y ajoute des attributs action et method
-f.method = "POST"
-f.submit();                             // On appelle la méhtode submit pour l'envoyer
-
- -

Extrait des informations d'un élément de formulaire et définit quelques uns de ses attributs :

- -
<form name="formA" action="/cgi-bin/test" method="post">
- <p>Appuyez sur "Info" pour les détails du formulaire, ou "Définir" pour modifier ces détails.</p>
- <p>
-  <button type="button" onclick="getFormInfo();">Info</button>
-  <button type="button" onclick="setFormInfo(this.form);">Set</button>
-  <button type="reset">Reset</button>
- </p>
-
- <textarea id="form-info" rows="15" cols="20"></textarea>
-</form>
-
-<script>
-  function getFormInfo(){
-    // Obtenir une référence au formulaire par son nom
-    var f = document.forms["formA"];
-    // Les propriétés du formulaire qui nous intéressent
-    var properties = [ 'elements', 'length', 'name', 'charset', 'action', 'acceptCharset', 'action', 'enctype', 'method', 'target' ];
-    // Itérer sur les propriétés en les transformant en une chaîne que nous pouvons afficher à l'utilisateur
-    var info = properties.reduce(function(property) { return property + ": " + f[property] }, "").join("\n");
-
-    // Définir les <textarea> du formulaire pour en afficher les propriétés
-    document.forms["formA"].elements['form-info'].value = info;
-  }
-
-  function setFormInfo(f){ //L'argument doit être une référence d'élément de formulaire.
-    f.action = "a-different-url.cgi";
-    f.name   = "a-different-name";
-  }
-</script>
- -

Envoi d'un formulaire dans une nouvelle fenêtre :

- -
<!doctype html>
-<html>
-<head>
-<meta charset="utf-8">
-<title>Example new-window form submission</title>
-</head>
-<body>
-
-<form action="test.php" target="_blank">
-  <p><label>First name: <input type="text" name="firstname"></label></p>
-  <p><label>Last name: <input type="text" name="lastname"></label></p>
-  <p><label><input type="password" name="pwd"></label></p>
-
-  <fieldset>
-   <legend>Pet preference</legend>
-    <p><label><input type="radio" name="pet" value="cat"> Cat</label></p>
-    <p><label><input type="radio" name="pet" value="dog"> Dog</label></p>
-  </fieldset>
-
-  <fieldset>
-    <legend>Owned vehicles</legend>
-
-    <p><label><input type="checkbox" name="vehicle" value="Bike">I have a bike</label></p>
-    <p><label><input type="checkbox" name="vehicle" value="Car">I have a car</label></p>
-  </fieldset>
-
-  <p><button>Submit</button></p>
-</form>
-
-</body>
-</html>
- -

Envoi de formulaires et téléchargement de fichiers en utilisant XMLHttpRequest

- -

Vous pouvez consulter ce paragraphe si vous souhaitez en savoir plus pour sérialiser et envoyer un formulaire grâce à l'API {{domxref("XMLHttpRequest")}}.

- -

Spécifications

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
SpécificationÉtatCommentaires
{{SpecName('HTML WHATWG', "forms.html#the-form-element", "HTMLFormElement")}}{{Spec2('HTML WHATWG')}}Ajout de la méthode requestAutocomplete().
{{SpecName('HTML5 W3C', "forms.html#the-form-element", "HTMLFormElement")}}{{Spec2('HTML5 W3C')}}Les propriétés de l'élément renvoient un élément {{domxref("HTMLFormControlsCollection")}} plutôt qu'un {{domxref("HTMLCollection")}} (changement principalement technique). Ajout de la méthode checkValidity(). Ajout des propriétés autocomplete, noValidate et encoding.
{{SpecName('DOM2 HTML', 'html.html#ID-40002357', 'HTMLFormElement')}}{{Spec2('DOM2 HTML')}}Aucune modification.
{{SpecName('DOM1', 'level-one-html.html#ID-40002357', 'HTMLFormElement')}}{{Spec2('DOM1')}}Définition initiale.
- -

Compatibilité des navigateurs

- - - -

{{Compat("api.HTMLFormElement")}}

- -

Voir aussi

- - diff --git a/files/fr/web/api/htmlformelement/index.md b/files/fr/web/api/htmlformelement/index.md new file mode 100644 index 0000000000..747286a784 --- /dev/null +++ b/files/fr/web/api/htmlformelement/index.md @@ -0,0 +1,223 @@ +--- +title: form +slug: Web/API/HTMLFormElement +tags: + - API + - Contrôles + - DOM + - Formulaire + - HTML + - Interface +translation_of: Web/API/HTMLFormElement +--- +
{{APIRef("HTML DOM")}}
+ +

L'interface HTMLFormElement représente un élément  {{HTMLElement("form")}} dans le DOM ; il peut être utilisé pour accéder et, dans quelques cas, modifier l'aspect du formulaire, ainsi que pour accéder à ses éléments composants.

+ +

{{InheritanceDiagram(600,120)}}

+ +

Propriétés

+ +

Cette interface hérite aussi des propriétés de son parent {{domxref("HTMLElement")}}.

+ +
+
{{domxref("HTMLFormElement.elements")}}{{ReadOnlyInline}}
+
Un élément {{domxref("HTMLFormControlsCollection")}} regroupant les différents contrôles associés à ce formulaire.
+
{{domxref("HTMLFormElement.length")}}{{ReadOnlyInline}}
+
Une valeur de type long indiquant le nombre de contrôles dans le formulaire.
+
{{domxref("HTMLFormElement.name")}}
+
Une chaîne {{domxref("DOMString")}} indiquant la valeur de l'attribut HTML {{htmlattrxref("name", "form")}} pour ce formulaire et qui correspond au nom du formulaire.
+
{{domxref("HTMLFormElement.method")}}
+
Une chaîne {{domxref("DOMString")}} indiquant la valeur de l'attribut HTML {{htmlattrxref("method", "form")}} pour ce formulaire et qui correspond à la méthode HTTP utilisée pour envoyer le formulaires. Seules certaines valeurs peuvent être utilisées avec cette propriété.
+
{{domxref("HTMLFormElement.target")}}
+
Une chaîne {{domxref("DOMString")}} indiquant la valeur de l'attribut HTML {{htmlattrxref("target", "form")}} pour ce formulaire et qui indique l'emplacement où seront affichées les résultats après envoi du formulaire.
+
{{domxref("HTMLFormElement.action")}}
+
Une chaîne {{domxref("DOMString")}} indiquant la valeur de l'attribut HTML {{htmlattrxref("action", "form")}} pour ce formulaire et qui contient l'URI d'un programme traitant les informations transmises via le formulaire.
+
{{domxref("HTMLFormElement.encoding")}} ou {{domxref("HTMLFormElement.enctype")}}
+
Une chaîne {{domxref("DOMString")}} indiquant la valeur de l'attribut HTML {{htmlattrxref("enctype", "form")}} pour ce formulaire et qui correspond au type de contenu utilisé pour transmettre les données du formulaire vers le serveur. Seules certaines valeurs peuvent être utilisées pour cette propriété. Les deux noms indiqués pour la méthode sont synonymes.
+
{{domxref("HTMLFormElement.acceptCharset")}}
+
Une chaîne {{domxref("DOMString")}} indiquant la valeur de l'attribut HTML {{htmlattrxref("accept-charset", "form")}} pour ce formulaire et qui correspond au jeu de caractères / à l'encodage pris en charge par le serveur.
+
{{domxref("HTMLFormElement.autocomplete")}}
+
Une chaîne {{domxref("DOMString")}} indiquant la valeur de l'attribut HTML {{htmlattrxref("autocomplete", "form")}} pour ce formulaire et qui indique si les contrôles du formulaire sont automatiquement renseignés par le navigateur.
+
{{domxref("HTMLFormElement.noValidate")}}
+
Un booléen indiquant la valeur de l'attribut HTML {{htmlattrxref("novalidate", "form")}} pour ce formulaire et qui indique si le formulaire ne devrait pas être validé.
+
+ +

Les champs de saisie nommés sont ajoutés comme propriétés sur leurs formulaires associés. Ces propriétés peuvent surcharger les propriétés natives si elles utilisent le même nom ! Par exemple, un formulaire disposant d'un {{HTMLElement("<input>")}} nommé action surchargera la propriété native action et tout appel renverra le champ input plutôt que la valeur de l'attribut HTML {{htmlattrxref("action", "form")}}.

+ +

Méthodes

+ +

Cette interface hérite aussi des méthodes de son parent {{domxref("HTMLElement")}}.

+ +
+
{{domxref("HTMLFormElement.submit()")}}
+
soumet le formulaire au serveur.
+
{{domxref("HTMLFormElement.reset()")}}
+
redéfinit le formulaire à son état initial.
+
{{domxref("HTMLFormElement.checkValidity()")}}
+
renvoie true si les contrôles du formulaire sont soumis à des contraintes de validation et les respectent. Elle renvoie false si certains contrôles ne respectent pas leurs contraintes. Elle déclenche un évènement {{event("invalid")}} pour chaque contrôle qui ne respecte pas ses contraintes. De tels contrôles sont considérés invalides si l'évènement n'est pas annulé. C'est au développeur de choisir comment réagir face à la valeur false produite par cette méthode.
+
{{domxref("HTMLFormElement.reportValidity()")}}
+
renvoie true si les contrôles du formulaire respectent leurs contraintes de validation. Lorsque false est renvoyé, des évènements annulables {{Event("invalid")}} sont déclenchés pour chaque contrôle invalide et les problèmes de validation sont rapportés à l'utilisateur.
+
{{domxref("HTMLFormElement.requestAutocomplete()")}} {{obsolete_inline}}
+
déclenche une interface native du navigateur afin d'aider les utilisateurs à remplir les champs pour lesquels la valeur nommée du champ à remplissage automatique ne vaut pas off ou on. Le formulaire reçoit un évènement lorsque l'utilisateur a fini d'intéragir avec l'interface, l'événement sera {{event("autocomplete")}} si les champs ont bien été remplis ou {{event("autocompleteerror")}} s'il y a eu un problème. Cette méthode a été retirée de Chrome et Firefox — cf. {{bug(1270740)}} pour plus d'informations et les raisons associées.
+
+ +

Notes d'utilisation

+ +

Obtention d'un objet élément de formulaire

+ +

Pour obtenir un objet HTMLFormElement, vous pouvez utiliser un sélecteur CSS avec {{domxref("ParentNode.querySelector", "querySelector()")}}  ou vous pouvez obtenir une liste de tous les formulaires du document utilisant sa propriété {{domxref("Document.forms", "forms")}}.

+ +

{{domxref("Document.forms")}} renvoie un tableau des objets HTMLFormElement listant chacun des formulaires de la page. Vous pouvez utiliser alors l'une des syntaxes suivantes pour obtenir un formulaire individuel :

+ +
+
document.forms[index]
+
renvoie le formulaire à l'index spécifié dans le tableau du formulaire.
+
document.forms[id]
+
renvoie le formulaire dont l'ID (identifiant) est id .
+
document.forms[name]
+
renvoie le formulaire dont la valeur d'attribut de {{domxref("Element.name", "name")}} est name.
+
+ +

Accès aux éléments du formulaire

+ +

Vous pouvez accéder à la liste des éléments contenant des données dans le formulaire en examinant la propriété {{domxref ("HTMLFormElement.elements", "elements")}}. Ceci retourne une {{domxref ("HTMLFormControlsCollection")}} listant tous les éléments d'entrée de données utilisateur du formulaire, aussi bien ceux qui sont des descendants du <form> que ceux déclarés membres du formulaire par leurs attributs.

+ +

Éléments considérés comme des contrôles de formulaire

+ +

Les éléments qui sont inclus par HTMLFormElement.elements et  HTMLFormElement.length sont :

+ + + +

Exemples

+ +

Crée un nouvel élément de formulaire, modifie ses attributs et l'envoie :

+ +
var f = document.createElement("form"); // On crée un formulaire
+document.body.appendChild(f);           // On l'ajoute au corps du document
+f.action = "/cgi-bin/some.cgi";         // On y ajoute des attributs action et method
+f.method = "POST"
+f.submit();                             // On appelle la méhtode submit pour l'envoyer
+
+ +

Extrait des informations d'un élément de formulaire et définit quelques uns de ses attributs :

+ +
<form name="formA" action="/cgi-bin/test" method="post">
+ <p>Appuyez sur "Info" pour les détails du formulaire, ou "Définir" pour modifier ces détails.</p>
+ <p>
+  <button type="button" onclick="getFormInfo();">Info</button>
+  <button type="button" onclick="setFormInfo(this.form);">Set</button>
+  <button type="reset">Reset</button>
+ </p>
+
+ <textarea id="form-info" rows="15" cols="20"></textarea>
+</form>
+
+<script>
+  function getFormInfo(){
+    // Obtenir une référence au formulaire par son nom
+    var f = document.forms["formA"];
+    // Les propriétés du formulaire qui nous intéressent
+    var properties = [ 'elements', 'length', 'name', 'charset', 'action', 'acceptCharset', 'action', 'enctype', 'method', 'target' ];
+    // Itérer sur les propriétés en les transformant en une chaîne que nous pouvons afficher à l'utilisateur
+    var info = properties.reduce(function(property) { return property + ": " + f[property] }, "").join("\n");
+
+    // Définir les <textarea> du formulaire pour en afficher les propriétés
+    document.forms["formA"].elements['form-info'].value = info;
+  }
+
+  function setFormInfo(f){ //L'argument doit être une référence d'élément de formulaire.
+    f.action = "a-different-url.cgi";
+    f.name   = "a-different-name";
+  }
+</script>
+ +

Envoi d'un formulaire dans une nouvelle fenêtre :

+ +
<!doctype html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>Example new-window form submission</title>
+</head>
+<body>
+
+<form action="test.php" target="_blank">
+  <p><label>First name: <input type="text" name="firstname"></label></p>
+  <p><label>Last name: <input type="text" name="lastname"></label></p>
+  <p><label><input type="password" name="pwd"></label></p>
+
+  <fieldset>
+   <legend>Pet preference</legend>
+    <p><label><input type="radio" name="pet" value="cat"> Cat</label></p>
+    <p><label><input type="radio" name="pet" value="dog"> Dog</label></p>
+  </fieldset>
+
+  <fieldset>
+    <legend>Owned vehicles</legend>
+
+    <p><label><input type="checkbox" name="vehicle" value="Bike">I have a bike</label></p>
+    <p><label><input type="checkbox" name="vehicle" value="Car">I have a car</label></p>
+  </fieldset>
+
+  <p><button>Submit</button></p>
+</form>
+
+</body>
+</html>
+ +

Envoi de formulaires et téléchargement de fichiers en utilisant XMLHttpRequest

+ +

Vous pouvez consulter ce paragraphe si vous souhaitez en savoir plus pour sérialiser et envoyer un formulaire grâce à l'API {{domxref("XMLHttpRequest")}}.

+ +

Spécifications

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpécificationÉtatCommentaires
{{SpecName('HTML WHATWG', "forms.html#the-form-element", "HTMLFormElement")}}{{Spec2('HTML WHATWG')}}Ajout de la méthode requestAutocomplete().
{{SpecName('HTML5 W3C', "forms.html#the-form-element", "HTMLFormElement")}}{{Spec2('HTML5 W3C')}}Les propriétés de l'élément renvoient un élément {{domxref("HTMLFormControlsCollection")}} plutôt qu'un {{domxref("HTMLCollection")}} (changement principalement technique). Ajout de la méthode checkValidity(). Ajout des propriétés autocomplete, noValidate et encoding.
{{SpecName('DOM2 HTML', 'html.html#ID-40002357', 'HTMLFormElement')}}{{Spec2('DOM2 HTML')}}Aucune modification.
{{SpecName('DOM1', 'level-one-html.html#ID-40002357', 'HTMLFormElement')}}{{Spec2('DOM1')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ + + +

{{Compat("api.HTMLFormElement")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/htmlformelement/length/index.html b/files/fr/web/api/htmlformelement/length/index.html deleted file mode 100644 index 93fb19ff7c..0000000000 --- a/files/fr/web/api/htmlformelement/length/index.html +++ /dev/null @@ -1,29 +0,0 @@ ---- -title: HTMLFormElement.length -slug: Web/API/HTMLFormElement/length -translation_of: Web/API/HTMLFormElement/length ---- -
-
{{APIRef("HTML DOM")}}
-
- -

La propriété en lecture seule HTMLFormElement.length retourne le nombre de contrôles présents dans l'élément {{HTMLElement("Form")}}.

- -

Syntaxe

- -
integer = form.length
-
- -

Exemple

- -
if (document.getElementById("form1").length > 1) {
-  // more than one form control here
-}
-
- -

Spécifications

- - diff --git a/files/fr/web/api/htmlformelement/length/index.md b/files/fr/web/api/htmlformelement/length/index.md new file mode 100644 index 0000000000..93fb19ff7c --- /dev/null +++ b/files/fr/web/api/htmlformelement/length/index.md @@ -0,0 +1,29 @@ +--- +title: HTMLFormElement.length +slug: Web/API/HTMLFormElement/length +translation_of: Web/API/HTMLFormElement/length +--- +
+
{{APIRef("HTML DOM")}}
+
+ +

La propriété en lecture seule HTMLFormElement.length retourne le nombre de contrôles présents dans l'élément {{HTMLElement("Form")}}.

+ +

Syntaxe

+ +
integer = form.length
+
+ +

Exemple

+ +
if (document.getElementById("form1").length > 1) {
+  // more than one form control here
+}
+
+ +

Spécifications

+ + diff --git a/files/fr/web/api/htmlformelement/method/index.html b/files/fr/web/api/htmlformelement/method/index.html deleted file mode 100644 index 2b6d2ab603..0000000000 --- a/files/fr/web/api/htmlformelement/method/index.html +++ /dev/null @@ -1,25 +0,0 @@ ---- -title: HTMLFormElement.method -slug: Web/API/HTMLFormElement/method -translation_of: Web/API/HTMLFormElement/method ---- -
{{APIRef("HTML DOM")}}
- -

La propriété HTMLFormElement.method représente la méthode HTTP utilisée pour soumettre un formulaire.

- -

Syntaxe

- -
string = form.method
-form.method = string
-
- -

Exemple

- -
document.forms["myform"].method = "post";
-
- -

Spécification

- -

HTML 5, Section 4.10.19.6, Form submission

- -

DOM Level 2 HTML: method

diff --git a/files/fr/web/api/htmlformelement/method/index.md b/files/fr/web/api/htmlformelement/method/index.md new file mode 100644 index 0000000000..2b6d2ab603 --- /dev/null +++ b/files/fr/web/api/htmlformelement/method/index.md @@ -0,0 +1,25 @@ +--- +title: HTMLFormElement.method +slug: Web/API/HTMLFormElement/method +translation_of: Web/API/HTMLFormElement/method +--- +
{{APIRef("HTML DOM")}}
+ +

La propriété HTMLFormElement.method représente la méthode HTTP utilisée pour soumettre un formulaire.

+ +

Syntaxe

+ +
string = form.method
+form.method = string
+
+ +

Exemple

+ +
document.forms["myform"].method = "post";
+
+ +

Spécification

+ +

HTML 5, Section 4.10.19.6, Form submission

+ +

DOM Level 2 HTML: method

diff --git a/files/fr/web/api/htmlformelement/name/index.html b/files/fr/web/api/htmlformelement/name/index.html deleted file mode 100644 index 50fa4fe6b1..0000000000 --- a/files/fr/web/api/htmlformelement/name/index.html +++ /dev/null @@ -1,32 +0,0 @@ ---- -title: HTMLFormElement.name -slug: Web/API/HTMLFormElement/name -translation_of: Web/API/HTMLFormElement/name ---- -
-
{{APIRef("HTML DOM")}}
-
- -

La propriété HTMLFormElement.name représente le nom de l'élément form sous la forme d'une chaîne de caratères.

- -

Si votre {{HTMLElement("Form")}} contient un élément appelé name, alors ce dernier redéfinit la propriété form.name, afin que vous ne puissiez y accéder. Internet Explorer (IE) bloque la définition ou la modification du nom d'un élément créé avec createElement() à partir de la propriété name.

- -

Syntaxe

- -
string = form.name
-form.name = string
- -

Exemple

- -
var form1name = document.getElementById("form1").name;
-
-if (form1name != document.form.form1) {
-   // browser doesn't support this form of reference
-}
- -

Spécification

- - diff --git a/files/fr/web/api/htmlformelement/name/index.md b/files/fr/web/api/htmlformelement/name/index.md new file mode 100644 index 0000000000..50fa4fe6b1 --- /dev/null +++ b/files/fr/web/api/htmlformelement/name/index.md @@ -0,0 +1,32 @@ +--- +title: HTMLFormElement.name +slug: Web/API/HTMLFormElement/name +translation_of: Web/API/HTMLFormElement/name +--- +
+
{{APIRef("HTML DOM")}}
+
+ +

La propriété HTMLFormElement.name représente le nom de l'élément form sous la forme d'une chaîne de caratères.

+ +

Si votre {{HTMLElement("Form")}} contient un élément appelé name, alors ce dernier redéfinit la propriété form.name, afin que vous ne puissiez y accéder. Internet Explorer (IE) bloque la définition ou la modification du nom d'un élément créé avec createElement() à partir de la propriété name.

+ +

Syntaxe

+ +
string = form.name
+form.name = string
+ +

Exemple

+ +
var form1name = document.getElementById("form1").name;
+
+if (form1name != document.form.form1) {
+   // browser doesn't support this form of reference
+}
+ +

Spécification

+ + diff --git a/files/fr/web/api/htmlformelement/reportvalidity/index.html b/files/fr/web/api/htmlformelement/reportvalidity/index.html deleted file mode 100644 index c41fd7c61d..0000000000 --- a/files/fr/web/api/htmlformelement/reportvalidity/index.html +++ /dev/null @@ -1,58 +0,0 @@ ---- -title: HTMLFormElement.reportValidity() -slug: Web/API/HTMLFormElement/reportValidity -tags: - - HTML - - Méthode -translation_of: Web/API/HTMLFormElement/reportValidity ---- -
{{APIRef("HTML DOM")}}
- -

La méthode  HTMLFormElement.reportValidity() renvoie true si les contrôles enfants de l'élément répondent à leurs contraintes de validation. Lorsque la valeur false est renvoyée, ,  les événements invalid annulables sont déclenchés pour chaque enfant non valide et les problèmes de validation sont signalés à l'utilisateur. .

- -

Syntax

- -
HTMLFormElement.reportValidity()
-
- -

Valeur de retour

- -

{{domxref("Boolean")}}

- -

Exemple

- -
document.forms['myform'].addEventListener('invalid', function() {
-  // Optional response here
-}, false);
-
-document.forms['myform'].addEventListener('submit', function() {
-  document.forms['myform'].reportValidity();
-}, false);
- -

Specifications

- - - - - - - - - - - - - - - - - - - - - -
SpecificationStatusCommentaire
{{SpecName("HTML WHATWG", "forms.html#dom-cva-reportvalidity", "HTMLFormElement.reportValidity()")}}{{Spec2("HTML WHATWG")}} 
{{SpecName("HTML5.1", "semantics.html#the-constraint-validation-api", "HTMLFormElement.reportValidity()")}}{{Spec2("HTML5.1")}}Définition initiale
- -

Compatibilité des navigateurs

- -

{{Compat("api.HTMLFormElement.reportValidity")}}

diff --git a/files/fr/web/api/htmlformelement/reportvalidity/index.md b/files/fr/web/api/htmlformelement/reportvalidity/index.md new file mode 100644 index 0000000000..c41fd7c61d --- /dev/null +++ b/files/fr/web/api/htmlformelement/reportvalidity/index.md @@ -0,0 +1,58 @@ +--- +title: HTMLFormElement.reportValidity() +slug: Web/API/HTMLFormElement/reportValidity +tags: + - HTML + - Méthode +translation_of: Web/API/HTMLFormElement/reportValidity +--- +
{{APIRef("HTML DOM")}}
+ +

La méthode  HTMLFormElement.reportValidity() renvoie true si les contrôles enfants de l'élément répondent à leurs contraintes de validation. Lorsque la valeur false est renvoyée, ,  les événements invalid annulables sont déclenchés pour chaque enfant non valide et les problèmes de validation sont signalés à l'utilisateur. .

+ +

Syntax

+ +
HTMLFormElement.reportValidity()
+
+ +

Valeur de retour

+ +

{{domxref("Boolean")}}

+ +

Exemple

+ +
document.forms['myform'].addEventListener('invalid', function() {
+  // Optional response here
+}, false);
+
+document.forms['myform'].addEventListener('submit', function() {
+  document.forms['myform'].reportValidity();
+}, false);
+ +

Specifications

+ + + + + + + + + + + + + + + + + + + + + +
SpecificationStatusCommentaire
{{SpecName("HTML WHATWG", "forms.html#dom-cva-reportvalidity", "HTMLFormElement.reportValidity()")}}{{Spec2("HTML WHATWG")}} 
{{SpecName("HTML5.1", "semantics.html#the-constraint-validation-api", "HTMLFormElement.reportValidity()")}}{{Spec2("HTML5.1")}}Définition initiale
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.HTMLFormElement.reportValidity")}}

diff --git a/files/fr/web/api/htmlformelement/reset/index.html b/files/fr/web/api/htmlformelement/reset/index.html deleted file mode 100644 index 6d43514959..0000000000 --- a/files/fr/web/api/htmlformelement/reset/index.html +++ /dev/null @@ -1,28 +0,0 @@ ---- -title: HTMLFormElement.reset() -slug: Web/API/HTMLFormElement/reset -tags: - - API - - HTML DOM - - HTMLFormElement - - Méthode - - Reference -translation_of: Web/API/HTMLFormElement/reset ---- -
{{APIRef("HTML DOM")}}
- -

La méthode HTMLFormElement.reset() restaure les valeurs par défaut des éléments du formulaire. Cette méthode fait la même chose que lorsqu'on clique sur un bouton de type reset.

- -

Si un élément du formulaire (comme un bouton reset par exemple) a un name ou id valant reset, celui-ci remplacera la méthode reset du formulaire. Les attributs des éléments, comme disabled, ne sont pas réinitialisés.

- -

Syntaxe

- -
HTMLFormElement.reset()
-
- -

Exemple

- -
document.getElementById("myform").reset();
-
- -

Spécification

diff --git a/files/fr/web/api/htmlformelement/reset/index.md b/files/fr/web/api/htmlformelement/reset/index.md new file mode 100644 index 0000000000..6d43514959 --- /dev/null +++ b/files/fr/web/api/htmlformelement/reset/index.md @@ -0,0 +1,28 @@ +--- +title: HTMLFormElement.reset() +slug: Web/API/HTMLFormElement/reset +tags: + - API + - HTML DOM + - HTMLFormElement + - Méthode + - Reference +translation_of: Web/API/HTMLFormElement/reset +--- +
{{APIRef("HTML DOM")}}
+ +

La méthode HTMLFormElement.reset() restaure les valeurs par défaut des éléments du formulaire. Cette méthode fait la même chose que lorsqu'on clique sur un bouton de type reset.

+ +

Si un élément du formulaire (comme un bouton reset par exemple) a un name ou id valant reset, celui-ci remplacera la méthode reset du formulaire. Les attributs des éléments, comme disabled, ne sont pas réinitialisés.

+ +

Syntaxe

+ +
HTMLFormElement.reset()
+
+ +

Exemple

+ +
document.getElementById("myform").reset();
+
+ +

Spécification

diff --git a/files/fr/web/api/htmlformelement/submit/index.html b/files/fr/web/api/htmlformelement/submit/index.html deleted file mode 100644 index 19479867d2..0000000000 --- a/files/fr/web/api/htmlformelement/submit/index.html +++ /dev/null @@ -1,40 +0,0 @@ ---- -title: HTMLFormElement.submit() -slug: Web/API/HTMLFormElement/submit -tags: - - HTML DOM - - HTMLFormElement - - Méthode -translation_of: Web/API/HTMLFormElement/submit ---- -
{{APIRef("HTML DOM")}}
- -

La méthode  HTMLFormElement.submit()  soumet un {{HtmlElement("form")}} donné

- -

Cette méthode est similaire, mais pas identique, à l’activation du script submit {{HtmlElement ("button")}}. Lors de l'appel direct de cette méthode, cependant:

- - - -

Si un contrôle de formulaire (tel qu'un  submit bouton ) a unname ou un id de submit, cette méthode masquera la méthode d'envoi du formulaire.

- -

Syntax

- -
HTMLFormElement.submit()
-
- -

Exemple

- -
document.forms["myform"].submit();
-
- -

Specification

- -

HTML Living standard: The form element

- -

Compatibilité des navigateurs

- -

{{Compat("api.HTMLFormElement.submit")}}

diff --git a/files/fr/web/api/htmlformelement/submit/index.md b/files/fr/web/api/htmlformelement/submit/index.md new file mode 100644 index 0000000000..19479867d2 --- /dev/null +++ b/files/fr/web/api/htmlformelement/submit/index.md @@ -0,0 +1,40 @@ +--- +title: HTMLFormElement.submit() +slug: Web/API/HTMLFormElement/submit +tags: + - HTML DOM + - HTMLFormElement + - Méthode +translation_of: Web/API/HTMLFormElement/submit +--- +
{{APIRef("HTML DOM")}}
+ +

La méthode  HTMLFormElement.submit()  soumet un {{HtmlElement("form")}} donné

+ +

Cette méthode est similaire, mais pas identique, à l’activation du script submit {{HtmlElement ("button")}}. Lors de l'appel direct de cette méthode, cependant:

+ + + +

Si un contrôle de formulaire (tel qu'un  submit bouton ) a unname ou un id de submit, cette méthode masquera la méthode d'envoi du formulaire.

+ +

Syntax

+ +
HTMLFormElement.submit()
+
+ +

Exemple

+ +
document.forms["myform"].submit();
+
+ +

Specification

+ +

HTML Living standard: The form element

+ +

Compatibilité des navigateurs

+ +

{{Compat("api.HTMLFormElement.submit")}}

diff --git a/files/fr/web/api/htmlformelement/submit_event/index.html b/files/fr/web/api/htmlformelement/submit_event/index.html deleted file mode 100644 index 2e6139eced..0000000000 --- a/files/fr/web/api/htmlformelement/submit_event/index.html +++ /dev/null @@ -1,60 +0,0 @@ ---- -title: submit -slug: Web/API/HTMLFormElement/submit_event -translation_of: Web/API/HTMLFormElement/submit_event -original_slug: Web/API/HTMLFormElement/submit_event_ ---- -

L’événement submit est émis lorsqu’un formulaire est soumis au serveur.

- -

Notez que l’événement submit se déclenche uniquement sur l’élement form, et pas sur les éléments button ou input submit. (Les formulaires sont soumis, pas les boutons.)

- -

Informations générales

- -
-
Spécification
-
HTML5
-
Interface
-
{{domxref("Event")}}
-
Bouillonne
-
Oui (bien que spécifié comme un événement simple qui ne bouillonne pas)
-
Annulable
-
Oui
-
Cible
-
Élément
-
Action par défaut
-
Variable (envoie le contenu du formulaire au serveur)
-
- -

Propriétés

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
PropriétéTypeDescription
target {{readonlyInline}}{{domxref("EventTarget")}}La cible de l’évènement (la cible la plus haute dans l’arbre DOM).
type {{readonlyInline}}{{domxref("DOMString")}}Le type de l’évènement.
bubbles {{readonlyInline}}{{jsxref("Boolean")}}Si l’évènement bouillonne normalement ou non.
cancelable {{readonlyInline}}{{jsxref("Boolean")}}Si l’évènement est annulable ou non.
diff --git a/files/fr/web/api/htmlformelement/submit_event/index.md b/files/fr/web/api/htmlformelement/submit_event/index.md new file mode 100644 index 0000000000..2e6139eced --- /dev/null +++ b/files/fr/web/api/htmlformelement/submit_event/index.md @@ -0,0 +1,60 @@ +--- +title: submit +slug: Web/API/HTMLFormElement/submit_event +translation_of: Web/API/HTMLFormElement/submit_event +original_slug: Web/API/HTMLFormElement/submit_event_ +--- +

L’événement submit est émis lorsqu’un formulaire est soumis au serveur.

+ +

Notez que l’événement submit se déclenche uniquement sur l’élement form, et pas sur les éléments button ou input submit. (Les formulaires sont soumis, pas les boutons.)

+ +

Informations générales

+ +
+
Spécification
+
HTML5
+
Interface
+
{{domxref("Event")}}
+
Bouillonne
+
Oui (bien que spécifié comme un événement simple qui ne bouillonne pas)
+
Annulable
+
Oui
+
Cible
+
Élément
+
Action par défaut
+
Variable (envoie le contenu du formulaire au serveur)
+
+ +

Propriétés

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
PropriétéTypeDescription
target {{readonlyInline}}{{domxref("EventTarget")}}La cible de l’évènement (la cible la plus haute dans l’arbre DOM).
type {{readonlyInline}}{{domxref("DOMString")}}Le type de l’évènement.
bubbles {{readonlyInline}}{{jsxref("Boolean")}}Si l’évènement bouillonne normalement ou non.
cancelable {{readonlyInline}}{{jsxref("Boolean")}}Si l’évènement est annulable ou non.
diff --git a/files/fr/web/api/htmlformelement/target/index.html b/files/fr/web/api/htmlformelement/target/index.html deleted file mode 100644 index 3d7a6002d0..0000000000 --- a/files/fr/web/api/htmlformelement/target/index.html +++ /dev/null @@ -1,25 +0,0 @@ ---- -title: HTMLFormElement.target -slug: Web/API/HTMLFormElement/target -translation_of: Web/API/HTMLFormElement/target ---- -
{{APIRef("HTML DOM")}}
- -

La propriété HTMLFormElement.target représente la cible de l'action (i.e., le cadre de destination dans lequel produire le résultat).

- -

Syntaxe

- -
string = form.target
-form.target = string
-
- -

Exemple

- -
myForm.target = document.frames[1].name;
-
- -

Spécification

- -

HTML 5, Section 4.10.19.6, Form submission

- -

DOM Level 2 HTML: target

diff --git a/files/fr/web/api/htmlformelement/target/index.md b/files/fr/web/api/htmlformelement/target/index.md new file mode 100644 index 0000000000..3d7a6002d0 --- /dev/null +++ b/files/fr/web/api/htmlformelement/target/index.md @@ -0,0 +1,25 @@ +--- +title: HTMLFormElement.target +slug: Web/API/HTMLFormElement/target +translation_of: Web/API/HTMLFormElement/target +--- +
{{APIRef("HTML DOM")}}
+ +

La propriété HTMLFormElement.target représente la cible de l'action (i.e., le cadre de destination dans lequel produire le résultat).

+ +

Syntaxe

+ +
string = form.target
+form.target = string
+
+ +

Exemple

+ +
myForm.target = document.frames[1].name;
+
+ +

Spécification

+ +

HTML 5, Section 4.10.19.6, Form submission

+ +

DOM Level 2 HTML: target

-- cgit v1.2.3-54-g00ecf