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 --- files/fr/web/api/formdata/append/index.html | 98 -------------- files/fr/web/api/formdata/append/index.md | 98 ++++++++++++++ files/fr/web/api/formdata/delete/index.html | 78 ----------- files/fr/web/api/formdata/delete/index.md | 78 +++++++++++ files/fr/web/api/formdata/entries/index.html | 81 ----------- files/fr/web/api/formdata/entries/index.md | 81 +++++++++++ files/fr/web/api/formdata/formdata/index.html | 99 -------------- files/fr/web/api/formdata/formdata/index.md | 99 ++++++++++++++ files/fr/web/api/formdata/get/index.html | 66 --------- files/fr/web/api/formdata/get/index.md | 66 +++++++++ files/fr/web/api/formdata/getall/index.html | 82 ------------ files/fr/web/api/formdata/getall/index.md | 82 ++++++++++++ files/fr/web/api/formdata/has/index.html | 80 ----------- files/fr/web/api/formdata/has/index.md | 80 +++++++++++ files/fr/web/api/formdata/index.html | 87 ------------ files/fr/web/api/formdata/index.md | 87 ++++++++++++ files/fr/web/api/formdata/keys/index.html | 79 ----------- files/fr/web/api/formdata/keys/index.md | 79 +++++++++++ files/fr/web/api/formdata/set/index.html | 92 ------------- files/fr/web/api/formdata/set/index.md | 92 +++++++++++++ .../api/formdata/using_formdata_objects/index.html | 148 --------------------- .../api/formdata/using_formdata_objects/index.md | 148 +++++++++++++++++++++ files/fr/web/api/formdata/values/index.html | 79 ----------- files/fr/web/api/formdata/values/index.md | 79 +++++++++++ 24 files changed, 1069 insertions(+), 1069 deletions(-) delete mode 100644 files/fr/web/api/formdata/append/index.html create mode 100644 files/fr/web/api/formdata/append/index.md delete mode 100644 files/fr/web/api/formdata/delete/index.html create mode 100644 files/fr/web/api/formdata/delete/index.md delete mode 100644 files/fr/web/api/formdata/entries/index.html create mode 100644 files/fr/web/api/formdata/entries/index.md delete mode 100644 files/fr/web/api/formdata/formdata/index.html create mode 100644 files/fr/web/api/formdata/formdata/index.md delete mode 100644 files/fr/web/api/formdata/get/index.html create mode 100644 files/fr/web/api/formdata/get/index.md delete mode 100644 files/fr/web/api/formdata/getall/index.html create mode 100644 files/fr/web/api/formdata/getall/index.md delete mode 100644 files/fr/web/api/formdata/has/index.html create mode 100644 files/fr/web/api/formdata/has/index.md delete mode 100644 files/fr/web/api/formdata/index.html create mode 100644 files/fr/web/api/formdata/index.md delete mode 100644 files/fr/web/api/formdata/keys/index.html create mode 100644 files/fr/web/api/formdata/keys/index.md delete mode 100644 files/fr/web/api/formdata/set/index.html create mode 100644 files/fr/web/api/formdata/set/index.md delete mode 100644 files/fr/web/api/formdata/using_formdata_objects/index.html create mode 100644 files/fr/web/api/formdata/using_formdata_objects/index.md delete mode 100644 files/fr/web/api/formdata/values/index.html create mode 100644 files/fr/web/api/formdata/values/index.md (limited to 'files/fr/web/api/formdata') diff --git a/files/fr/web/api/formdata/append/index.html b/files/fr/web/api/formdata/append/index.html deleted file mode 100644 index 80ab87cb3f..0000000000 --- a/files/fr/web/api/formdata/append/index.html +++ /dev/null @@ -1,98 +0,0 @@ ---- -title: FormData.append() -slug: Web/API/FormData/append -tags: - - API - - Append - - FormData - - Méthode - - Reference - - XHR - - XMLHttpRequest -translation_of: Web/API/FormData/append ---- -

{{APIRef("XMLHttpRequest")}}

- -

La méthode append() de l'interface {{domxref("FormData")}} ajoute une nouvelle valeur à une clé existante dans un objet FormData, ou rajoute cette clé et cette valeur quand elle n'existe pas.

- -

La différence entre {{domxref("FormData.set")}} et append() est que, quand la clé existe, {{domxref("FormData.set")}} va remplacer les valeurs existantes avec la nouvelle alors qu' append() va rajouter celle-ci à la fin de l'ensemble des valeurs existantes.

- -
-

Note : Cette méthode est disponible dans les Web Workers.

-
- -

Syntaxe

- -

Il y a deux versions de cette méthode : avec deux ou trois paramètres

- -
formData.append(name, value);
-formData.append(name, value, filename);
- -

Paramètres

- -
-
name
-
Le nom de la clé dont les données sont contenues dans value.
-
value
-
La valeur du champ clé. Elle peut être une {{domxref("USVString")}} ou un {{domxref("Blob")}} (incluant les sous-classes comme {{domxref("File")}}).
-
filename {{optional_inline}}
-
Le nom du fichier envoyé au serveur (a {{domxref("USVString")}}), quand un {{domxref("Blob")}} ou un {{domxref("File")}} est passé en second paramètre. Le nom du fichier par défaut pour des objets {{domxref("Blob")}} est "blob". Le nom du fichier par défaut pour des objets {{domxref("File")}} est le nom du fichier de l'objet.
-
- -
-

Note: Si vous spécifiez un  {{domxref("Blob")}} comme donnée rattachée à un objet de type FormData, le nom de fichier envoyé au serveur sera dans l'entête "Content-Disposition" mais peut varier selon le navigateur.

-
- -

Retours

- -

Void.

- -

Exemple

- -

La ligne suivante crée un objet FormData vide :

- -
var formData = new FormData(); // Actuellement vide
- -

Vous pouvez rajouter des paires clé/valeur en utilisant {{domxref("FormData.append")}}:

- -
formData.append('username', 'Chris');
-formData.append('userpic', myFileInput.files[0], 'chris.jpg');
- -

Comme pour un formulaire classique, vous pouvez ajouter plusieurs valeurs pour la même clé. Par exemple ( et pour être en accord avec les conventions de nommage PHP, on ajoute [] au nom de la clé):

- -
formData.append('userpic[]', myFileInput.files[0], 'chris1.jpg');
-formData.append('userpic[]', myFileInput.files[1], 'chris2.jpg');
- -

Cette technique permet de simplement gérer l'envoi de plusieurs fichiers avec l'envoi d'une structure facilement itérable.

- -

Spécifications

- - - - - - - - - - - - - - -
SpécificationStatutCommentaire
{{SpecName('XMLHttpRequest','#dom-formdata-append','append()')}}{{Spec2('XMLHttpRequest')}}Définition initiale
- -

Compatibilité des navigateurs

- - - -

{{Compat("api.FormData.append")}}

- -

Voir aussi

- - diff --git a/files/fr/web/api/formdata/append/index.md b/files/fr/web/api/formdata/append/index.md new file mode 100644 index 0000000000..80ab87cb3f --- /dev/null +++ b/files/fr/web/api/formdata/append/index.md @@ -0,0 +1,98 @@ +--- +title: FormData.append() +slug: Web/API/FormData/append +tags: + - API + - Append + - FormData + - Méthode + - Reference + - XHR + - XMLHttpRequest +translation_of: Web/API/FormData/append +--- +

{{APIRef("XMLHttpRequest")}}

+ +

La méthode append() de l'interface {{domxref("FormData")}} ajoute une nouvelle valeur à une clé existante dans un objet FormData, ou rajoute cette clé et cette valeur quand elle n'existe pas.

+ +

La différence entre {{domxref("FormData.set")}} et append() est que, quand la clé existe, {{domxref("FormData.set")}} va remplacer les valeurs existantes avec la nouvelle alors qu' append() va rajouter celle-ci à la fin de l'ensemble des valeurs existantes.

+ +
+

Note : Cette méthode est disponible dans les Web Workers.

+
+ +

Syntaxe

+ +

Il y a deux versions de cette méthode : avec deux ou trois paramètres

+ +
formData.append(name, value);
+formData.append(name, value, filename);
+ +

Paramètres

+ +
+
name
+
Le nom de la clé dont les données sont contenues dans value.
+
value
+
La valeur du champ clé. Elle peut être une {{domxref("USVString")}} ou un {{domxref("Blob")}} (incluant les sous-classes comme {{domxref("File")}}).
+
filename {{optional_inline}}
+
Le nom du fichier envoyé au serveur (a {{domxref("USVString")}}), quand un {{domxref("Blob")}} ou un {{domxref("File")}} est passé en second paramètre. Le nom du fichier par défaut pour des objets {{domxref("Blob")}} est "blob". Le nom du fichier par défaut pour des objets {{domxref("File")}} est le nom du fichier de l'objet.
+
+ +
+

Note: Si vous spécifiez un  {{domxref("Blob")}} comme donnée rattachée à un objet de type FormData, le nom de fichier envoyé au serveur sera dans l'entête "Content-Disposition" mais peut varier selon le navigateur.

+
+ +

Retours

+ +

Void.

+ +

Exemple

+ +

La ligne suivante crée un objet FormData vide :

+ +
var formData = new FormData(); // Actuellement vide
+ +

Vous pouvez rajouter des paires clé/valeur en utilisant {{domxref("FormData.append")}}:

+ +
formData.append('username', 'Chris');
+formData.append('userpic', myFileInput.files[0], 'chris.jpg');
+ +

Comme pour un formulaire classique, vous pouvez ajouter plusieurs valeurs pour la même clé. Par exemple ( et pour être en accord avec les conventions de nommage PHP, on ajoute [] au nom de la clé):

+ +
formData.append('userpic[]', myFileInput.files[0], 'chris1.jpg');
+formData.append('userpic[]', myFileInput.files[1], 'chris2.jpg');
+ +

Cette technique permet de simplement gérer l'envoi de plusieurs fichiers avec l'envoi d'une structure facilement itérable.

+ +

Spécifications

+ + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('XMLHttpRequest','#dom-formdata-append','append()')}}{{Spec2('XMLHttpRequest')}}Définition initiale
+ +

Compatibilité des navigateurs

+ + + +

{{Compat("api.FormData.append")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/formdata/delete/index.html b/files/fr/web/api/formdata/delete/index.html deleted file mode 100644 index 551431a588..0000000000 --- a/files/fr/web/api/formdata/delete/index.html +++ /dev/null @@ -1,78 +0,0 @@ ---- -title: FormData.delete() -slug: Web/API/FormData/delete -tags: - - API - - FormData - - Méthode - - Reference - - XHR - - XMLHttpRequest - - delete -translation_of: Web/API/FormData/delete ---- -

{{APIRef("XMLHttpRequest")}}

- -

La méthode delete() de l'interface {{domxref("FormData")}} supprime une clé et sa (ses) valeur(s) d'un objet FormData.

- -
-

Note : Cette méthode est disponible dans les Web Workers.

-
- -

Syntaxe

- -
formData.delete(name);
- -

Paramètres

- -
-
name
-
Le nom de la clé que vous voulez supprimer.
-
- -

Retours

- -

Void.

- -

Exemple

- -

La ligne suivante crée un objet FormData vide et le pré-remplit avec les paires clé/valeur d'un formulaire :

- -
var formData = new FormData(myForm);
- -

Vous pouvez supprimer les clés et leurs valeurs en utilisant delete():

- -
formData.delete('username');
-
- -

Spécifications

- - - - - - - - - - - - - - -
SpécificationStatutCommentaire
{{SpecName('XMLHttpRequest','#dom-formdata-delete','delete()')}}{{Spec2('XMLHttpRequest')}}
- -

Compatibilité des navigateurs

- - - -

{{Compat("api.FormData.delete")}}

- -

Voir aussi

- - diff --git a/files/fr/web/api/formdata/delete/index.md b/files/fr/web/api/formdata/delete/index.md new file mode 100644 index 0000000000..551431a588 --- /dev/null +++ b/files/fr/web/api/formdata/delete/index.md @@ -0,0 +1,78 @@ +--- +title: FormData.delete() +slug: Web/API/FormData/delete +tags: + - API + - FormData + - Méthode + - Reference + - XHR + - XMLHttpRequest + - delete +translation_of: Web/API/FormData/delete +--- +

{{APIRef("XMLHttpRequest")}}

+ +

La méthode delete() de l'interface {{domxref("FormData")}} supprime une clé et sa (ses) valeur(s) d'un objet FormData.

+ +
+

Note : Cette méthode est disponible dans les Web Workers.

+
+ +

Syntaxe

+ +
formData.delete(name);
+ +

Paramètres

+ +
+
name
+
Le nom de la clé que vous voulez supprimer.
+
+ +

Retours

+ +

Void.

+ +

Exemple

+ +

La ligne suivante crée un objet FormData vide et le pré-remplit avec les paires clé/valeur d'un formulaire :

+ +
var formData = new FormData(myForm);
+ +

Vous pouvez supprimer les clés et leurs valeurs en utilisant delete():

+ +
formData.delete('username');
+
+ +

Spécifications

+ + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('XMLHttpRequest','#dom-formdata-delete','delete()')}}{{Spec2('XMLHttpRequest')}}
+ +

Compatibilité des navigateurs

+ + + +

{{Compat("api.FormData.delete")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/formdata/entries/index.html b/files/fr/web/api/formdata/entries/index.html deleted file mode 100644 index dc940b71b6..0000000000 --- a/files/fr/web/api/formdata/entries/index.html +++ /dev/null @@ -1,81 +0,0 @@ ---- -title: FormData.entries() -slug: Web/API/FormData/entries -tags: - - API - - Entries - - FormData - - Méthode - - Reference - - XHR - - XMLHttpRequest -translation_of: Web/API/FormData/entries ---- -

{{APIRef("XMLHttpRequest")}}

- -

La methode FormData.entries() retourne un {{jsxref("Les_protocoles_iteration",'iterateur')}} permettant d'accéder aux paires clefs/valeurs contenues dans cet objet.
- La clef de chaque paire est une {{domxref("USVString")}}. De la même manière, la valeur peut être une {{domxref("USVString")}} ou un {{domxref("Blob")}}.

- -
-

Note : Cette methode est disponible dans les Web Workers.

-
- -

Syntaxe

- -
formData.entries();
- -

Valeur retournée

- -

Retourne un {{jsxref("Les_protocoles_iteration","iterateur")}}.

- -

Exemple

- -
// Creation d'un objet FormData
-var formData = new FormData();
-formData.append('key1', 'value1');
-formData.append('key2', 'value2');
-
-// Affichage des paires clefs/valeurs
-for(var pair of formData.entries()) {
-   console.log(pair[0]+ ', '+ pair[1]);
-}
-
- -

Le resultat est:

- -
key1, value1
-key2, value2
- -

Spécifications

- - - - - - - - - - - - - - -
SpécificationStatutCommentaire
{{SpecName('XMLHttpRequest','#dom-formdata','entries() (as iterator<>)')}}{{Spec2('XMLHttpRequest')}}Définition initiale
- -

Compatibilité navigateurs

- -
- - -

{{Compat("api.FormData.entries")}}

-
- -

Voir aussi

- - diff --git a/files/fr/web/api/formdata/entries/index.md b/files/fr/web/api/formdata/entries/index.md new file mode 100644 index 0000000000..dc940b71b6 --- /dev/null +++ b/files/fr/web/api/formdata/entries/index.md @@ -0,0 +1,81 @@ +--- +title: FormData.entries() +slug: Web/API/FormData/entries +tags: + - API + - Entries + - FormData + - Méthode + - Reference + - XHR + - XMLHttpRequest +translation_of: Web/API/FormData/entries +--- +

{{APIRef("XMLHttpRequest")}}

+ +

La methode FormData.entries() retourne un {{jsxref("Les_protocoles_iteration",'iterateur')}} permettant d'accéder aux paires clefs/valeurs contenues dans cet objet.
+ La clef de chaque paire est une {{domxref("USVString")}}. De la même manière, la valeur peut être une {{domxref("USVString")}} ou un {{domxref("Blob")}}.

+ +
+

Note : Cette methode est disponible dans les Web Workers.

+
+ +

Syntaxe

+ +
formData.entries();
+ +

Valeur retournée

+ +

Retourne un {{jsxref("Les_protocoles_iteration","iterateur")}}.

+ +

Exemple

+ +
// Creation d'un objet FormData
+var formData = new FormData();
+formData.append('key1', 'value1');
+formData.append('key2', 'value2');
+
+// Affichage des paires clefs/valeurs
+for(var pair of formData.entries()) {
+   console.log(pair[0]+ ', '+ pair[1]);
+}
+
+ +

Le resultat est:

+ +
key1, value1
+key2, value2
+ +

Spécifications

+ + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('XMLHttpRequest','#dom-formdata','entries() (as iterator<>)')}}{{Spec2('XMLHttpRequest')}}Définition initiale
+ +

Compatibilité navigateurs

+ +
+ + +

{{Compat("api.FormData.entries")}}

+
+ +

Voir aussi

+ + diff --git a/files/fr/web/api/formdata/formdata/index.html b/files/fr/web/api/formdata/formdata/index.html deleted file mode 100644 index 3852b6d2be..0000000000 --- a/files/fr/web/api/formdata/formdata/index.html +++ /dev/null @@ -1,99 +0,0 @@ ---- -title: FormData() -slug: Web/API/FormData/FormData -tags: - - API - - Constructeur - - FormData - - Reference - - XHR - - XMLHttpRequest -translation_of: Web/API/FormData/FormData ---- -

{{APIRef("XMLHttpRequest")}}

- -

Le constructeur FormData() crée un nouvel objet {{domxref("FormData")}}.

- -
-

Note : Cette fonctionnalité est disponible dans Web Workers.

-
- -

Syntaxe

- -
var formData = new FormData(form)
- -

Paramètres

- -
-
form {{optional_inline}}
-
Un element HTML {{HTMLElement("form")}} — quand il est spécifié, l'objet {{domxref("FormData")}} sera rempli avec les clés/valeurs du formulaire en utilisant les noms de propriétés de chaque élément pour clé et les valeurs soumises. Cela encodera aussi le contenu des fichiers.
-
- -

Exemples

- -

La ligne suivante crée un objet FormData vide:

- -
var formData = new FormData(); // Formulaire vide à cet instant
- -

Vous pouvez ajouter un couple clé/valeur en utilisant {{domxref("FormData.append")}} :

- -
formData.append('username', 'Chris');
-
- -

Ou vous pouvez spécifier l'argument optionnel form à la création de l'objet FormData pour le pré-remplir avec les valeurs issues du formulaire spécifié :

- -
<form id="myForm" name="myForm">
-  <div>
-    <label for="username">Enter name:</label>
-    <input type="text" id="username" name="username">
-  </div>
-  <div>
-    <label for="useracc">Enter account number:</label>
-    <input type="text" id="useracc" name="useracc">
-  </div>
-  <div>
-    <label for="userfile">Upload file:</label>
-    <input type="file" id="userfile" name="userfile">
-  </div>
-<input type="submit" value="Submit!">
-</form>
-
- -
-

Note : Seuls les champs de formulaires valides sont inclus dans un objet FormData, c'est-à-dire ceux qui portent un nom (attribut name), qui ne sont pas désactivés et qui sont cochés (boutons radio et cases à cocher) ou sélectionnés (une ou plusieurs options dans une sélection).

-
- -
var myForm = document.getElementById('myForm');
-formData = new FormData(myForm);
- -

Spécifications

- - - - - - - - - - - - - - - - -
SpécificationStatutCommentaires
{{SpecName('XMLHttpRequest','#dom-formdata','FormData()')}}{{Spec2('XMLHttpRequest')}}Définition initiale.
- -

Compatibilité des navigateurs

- -

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

- -

Voir aussi

- - diff --git a/files/fr/web/api/formdata/formdata/index.md b/files/fr/web/api/formdata/formdata/index.md new file mode 100644 index 0000000000..3852b6d2be --- /dev/null +++ b/files/fr/web/api/formdata/formdata/index.md @@ -0,0 +1,99 @@ +--- +title: FormData() +slug: Web/API/FormData/FormData +tags: + - API + - Constructeur + - FormData + - Reference + - XHR + - XMLHttpRequest +translation_of: Web/API/FormData/FormData +--- +

{{APIRef("XMLHttpRequest")}}

+ +

Le constructeur FormData() crée un nouvel objet {{domxref("FormData")}}.

+ +
+

Note : Cette fonctionnalité est disponible dans Web Workers.

+
+ +

Syntaxe

+ +
var formData = new FormData(form)
+ +

Paramètres

+ +
+
form {{optional_inline}}
+
Un element HTML {{HTMLElement("form")}} — quand il est spécifié, l'objet {{domxref("FormData")}} sera rempli avec les clés/valeurs du formulaire en utilisant les noms de propriétés de chaque élément pour clé et les valeurs soumises. Cela encodera aussi le contenu des fichiers.
+
+ +

Exemples

+ +

La ligne suivante crée un objet FormData vide:

+ +
var formData = new FormData(); // Formulaire vide à cet instant
+ +

Vous pouvez ajouter un couple clé/valeur en utilisant {{domxref("FormData.append")}} :

+ +
formData.append('username', 'Chris');
+
+ +

Ou vous pouvez spécifier l'argument optionnel form à la création de l'objet FormData pour le pré-remplir avec les valeurs issues du formulaire spécifié :

+ +
<form id="myForm" name="myForm">
+  <div>
+    <label for="username">Enter name:</label>
+    <input type="text" id="username" name="username">
+  </div>
+  <div>
+    <label for="useracc">Enter account number:</label>
+    <input type="text" id="useracc" name="useracc">
+  </div>
+  <div>
+    <label for="userfile">Upload file:</label>
+    <input type="file" id="userfile" name="userfile">
+  </div>
+<input type="submit" value="Submit!">
+</form>
+
+ +
+

Note : Seuls les champs de formulaires valides sont inclus dans un objet FormData, c'est-à-dire ceux qui portent un nom (attribut name), qui ne sont pas désactivés et qui sont cochés (boutons radio et cases à cocher) ou sélectionnés (une ou plusieurs options dans une sélection).

+
+ +
var myForm = document.getElementById('myForm');
+formData = new FormData(myForm);
+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaires
{{SpecName('XMLHttpRequest','#dom-formdata','FormData()')}}{{Spec2('XMLHttpRequest')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +

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

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/formdata/get/index.html b/files/fr/web/api/formdata/get/index.html deleted file mode 100644 index 5eec93c7e9..0000000000 --- a/files/fr/web/api/formdata/get/index.html +++ /dev/null @@ -1,66 +0,0 @@ ---- -title: FormData.get() -slug: Web/API/FormData/get -translation_of: Web/API/FormData/get -browser-compat: api.FormData.get ---- -

{{APIRef("XMLHttpRequest")}}

- -

La méthode get() de l'interface FormData renvoie la première valeur associée à une clé donnée dans un objet FormData. Si vous souhaitez manipuler plusieurs valeurs et les récupérer intégralement, utilisez plutôt la méthode getAll().

- -
-

Note : Cette méthode est disponible dans les Web Workers.

-
- -

Syntaxe

- -
formData.get(name);
- -

Paramètres

- -
-
name
-
Une chaîne de caractères USVString représentant le nom de la clé que vous souhaitez retrouver.
-
- -

Valeur de retour

- -

Un objet FormDataEntryValue contenant la valeur. Si la clé n'existe pas, la méthode renvoie null.

- -

Exemple

- -

La ligne suivante crée un objet FormData vide :

- -
-var formData = new FormData();
-
- -

Si nous ajoutons deux valeurs username en utilisant FormData.append :

- -
-formData.append('username', 'Chris');
-formData.append('username', 'Bob');
-
- -

L'appel suivant à get() renverra uniquement la première valeur username indexée :

- -
-formData.get('username'); // Renvoie "Chris"
-
- -

Spécifications

- -

{{Specifications}}

- -

Compatibilité des navigateurs

- -

{{Compat}}

- -

Voir aussi

- - diff --git a/files/fr/web/api/formdata/get/index.md b/files/fr/web/api/formdata/get/index.md new file mode 100644 index 0000000000..5eec93c7e9 --- /dev/null +++ b/files/fr/web/api/formdata/get/index.md @@ -0,0 +1,66 @@ +--- +title: FormData.get() +slug: Web/API/FormData/get +translation_of: Web/API/FormData/get +browser-compat: api.FormData.get +--- +

{{APIRef("XMLHttpRequest")}}

+ +

La méthode get() de l'interface FormData renvoie la première valeur associée à une clé donnée dans un objet FormData. Si vous souhaitez manipuler plusieurs valeurs et les récupérer intégralement, utilisez plutôt la méthode getAll().

+ +
+

Note : Cette méthode est disponible dans les Web Workers.

+
+ +

Syntaxe

+ +
formData.get(name);
+ +

Paramètres

+ +
+
name
+
Une chaîne de caractères USVString représentant le nom de la clé que vous souhaitez retrouver.
+
+ +

Valeur de retour

+ +

Un objet FormDataEntryValue contenant la valeur. Si la clé n'existe pas, la méthode renvoie null.

+ +

Exemple

+ +

La ligne suivante crée un objet FormData vide :

+ +
+var formData = new FormData();
+
+ +

Si nous ajoutons deux valeurs username en utilisant FormData.append :

+ +
+formData.append('username', 'Chris');
+formData.append('username', 'Bob');
+
+ +

L'appel suivant à get() renverra uniquement la première valeur username indexée :

+ +
+formData.get('username'); // Renvoie "Chris"
+
+ +

Spécifications

+ +

{{Specifications}}

+ +

Compatibilité des navigateurs

+ +

{{Compat}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/formdata/getall/index.html b/files/fr/web/api/formdata/getall/index.html deleted file mode 100644 index 2b1ced7864..0000000000 --- a/files/fr/web/api/formdata/getall/index.html +++ /dev/null @@ -1,82 +0,0 @@ ---- -title: FormData.getAll() -slug: Web/API/FormData/getAll -tags: - - API - - FormData - - Méthode - - Reference - - XHR - - XMLHttpRequest - - getAll -translation_of: Web/API/FormData/getAll ---- -

{{APIRef("XMLHttpRequest")}}

- -

La méthode getAll() de l'interface {{domxref("FormData")}} renvoie toutes les valeurs associées à une clé donnée à partir d'un objet FormData.

- -
-

Note : Cette méthode est disponible dans les Web Workers.

-
- -

Syntaxe

- -
formData.getAll(name);
- -

Paramètres

- -
-
name
-
Un {{domxref("USVString")}} représentant le nom de la clé que vous voulez récupérer.
-
- -

Retours

- -

Un tableau de {{domxref("FormDataEntryValue")}} dont la clé correspond à la valeur passée dans le paramètre name. Si la clé n'existe pas, la méthode renvoie une liste vide.

- -

Exemple

- -

La ligne suivante crée un objet FormData vide :

- -
var formData = new FormData();
- -

Si nous ajoutons deux valeurs username en utilisant {{domxref("FormData.append")}} :

- -
formData.append('username', 'Chris');
-formData.append('username', 'Bob');
- -

La fonction getAll() suivante va retourner chaque valeurs de username dans un tableau :

- -
formData.getAll('username'); // Returns ["Chris", "Bob"]
- -

Spécifications

- - - - - - - - - - - - - - -
SpécificationStatutCommentaire
{{SpecName('XMLHttpRequest','#dom-formdata-getall','getAll()')}}{{Spec2('XMLHttpRequest')}}
- -

Compatibilité des navigateurs

- - - -

{{Compat("api.FormData.getAll")}}

- -

Voir aussi

- - diff --git a/files/fr/web/api/formdata/getall/index.md b/files/fr/web/api/formdata/getall/index.md new file mode 100644 index 0000000000..2b1ced7864 --- /dev/null +++ b/files/fr/web/api/formdata/getall/index.md @@ -0,0 +1,82 @@ +--- +title: FormData.getAll() +slug: Web/API/FormData/getAll +tags: + - API + - FormData + - Méthode + - Reference + - XHR + - XMLHttpRequest + - getAll +translation_of: Web/API/FormData/getAll +--- +

{{APIRef("XMLHttpRequest")}}

+ +

La méthode getAll() de l'interface {{domxref("FormData")}} renvoie toutes les valeurs associées à une clé donnée à partir d'un objet FormData.

+ +
+

Note : Cette méthode est disponible dans les Web Workers.

+
+ +

Syntaxe

+ +
formData.getAll(name);
+ +

Paramètres

+ +
+
name
+
Un {{domxref("USVString")}} représentant le nom de la clé que vous voulez récupérer.
+
+ +

Retours

+ +

Un tableau de {{domxref("FormDataEntryValue")}} dont la clé correspond à la valeur passée dans le paramètre name. Si la clé n'existe pas, la méthode renvoie une liste vide.

+ +

Exemple

+ +

La ligne suivante crée un objet FormData vide :

+ +
var formData = new FormData();
+ +

Si nous ajoutons deux valeurs username en utilisant {{domxref("FormData.append")}} :

+ +
formData.append('username', 'Chris');
+formData.append('username', 'Bob');
+ +

La fonction getAll() suivante va retourner chaque valeurs de username dans un tableau :

+ +
formData.getAll('username'); // Returns ["Chris", "Bob"]
+ +

Spécifications

+ + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('XMLHttpRequest','#dom-formdata-getall','getAll()')}}{{Spec2('XMLHttpRequest')}}
+ +

Compatibilité des navigateurs

+ + + +

{{Compat("api.FormData.getAll")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/formdata/has/index.html b/files/fr/web/api/formdata/has/index.html deleted file mode 100644 index 2915f9d65a..0000000000 --- a/files/fr/web/api/formdata/has/index.html +++ /dev/null @@ -1,80 +0,0 @@ ---- -title: FormData.has() -slug: Web/API/FormData/has -tags: - - API - - FormData - - Méthode - - Reference - - XHR - - XMLHttpRequest - - has -translation_of: Web/API/FormData/has ---- -

{{APIRef("XMLHttpRequest")}}

- -

La méthode has() de l'interface {{domxref("FormData")}} renvoie un booléen indiquant si un objet FormData contient une certaine clé.

- -
-

Note : Cette méthode est disponible dans les Web Workers.

-
- -

Syntaxe

- -
formData.has(name);
- -

Paramètres

- -
-
name
-
Un {{domxref("USVString")}} représentant le nom de la clé que vous voulez tester.
-
- -

Retours

- -

Un {{domxref("Boolean")}}.

- -

Exemple

- -

La ligne suivante crée un objet FormData vide :

- -
var formData = new FormData();
- -

L'extrait suivant montre les résultats des tests effectués pour vérifier l'existence d'un username dans l'objet FormData, avant et après avoir ajouté une valeur username avec {{domxref("FormData.append")}} :

- -
formData.has('username'); // Retourne false
-formData.append('username', 'Chris');
-formData.has('username'); // Retourne true
-
- -

Spécifications

- - - - - - - - - - - - - - -
SpécificationStatutCommentaire
{{SpecName('XMLHttpRequest','#dom-formdata-has','has()')}}{{Spec2('XMLHttpRequest')}}
- -

Compatibilité des navigateurs

- - - -

{{Compat("api.FormData.has")}}

- -

Voir aussi

- - diff --git a/files/fr/web/api/formdata/has/index.md b/files/fr/web/api/formdata/has/index.md new file mode 100644 index 0000000000..2915f9d65a --- /dev/null +++ b/files/fr/web/api/formdata/has/index.md @@ -0,0 +1,80 @@ +--- +title: FormData.has() +slug: Web/API/FormData/has +tags: + - API + - FormData + - Méthode + - Reference + - XHR + - XMLHttpRequest + - has +translation_of: Web/API/FormData/has +--- +

{{APIRef("XMLHttpRequest")}}

+ +

La méthode has() de l'interface {{domxref("FormData")}} renvoie un booléen indiquant si un objet FormData contient une certaine clé.

+ +
+

Note : Cette méthode est disponible dans les Web Workers.

+
+ +

Syntaxe

+ +
formData.has(name);
+ +

Paramètres

+ +
+
name
+
Un {{domxref("USVString")}} représentant le nom de la clé que vous voulez tester.
+
+ +

Retours

+ +

Un {{domxref("Boolean")}}.

+ +

Exemple

+ +

La ligne suivante crée un objet FormData vide :

+ +
var formData = new FormData();
+ +

L'extrait suivant montre les résultats des tests effectués pour vérifier l'existence d'un username dans l'objet FormData, avant et après avoir ajouté une valeur username avec {{domxref("FormData.append")}} :

+ +
formData.has('username'); // Retourne false
+formData.append('username', 'Chris');
+formData.has('username'); // Retourne true
+
+ +

Spécifications

+ + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('XMLHttpRequest','#dom-formdata-has','has()')}}{{Spec2('XMLHttpRequest')}}
+ +

Compatibilité des navigateurs

+ + + +

{{Compat("api.FormData.has")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/formdata/index.html b/files/fr/web/api/formdata/index.html deleted file mode 100644 index 8fbf318e86..0000000000 --- a/files/fr/web/api/formdata/index.html +++ /dev/null @@ -1,87 +0,0 @@ ---- -title: FormData -slug: Web/API/FormData -tags: - - API - - FormData - - Interface - - Reference - - XMLHttpRequest -translation_of: Web/API/FormData ---- -

{{APIRef("XMLHttpRequest")}}

- -

L'interface FormData permet de construire facilement un ensemble de paires clé/valeur représentant les champs du formulaire et leurs valeurs, qui peuvent ensuite être facilement envoyées en utilisant la méthode {{domxref("XMLHttpRequest.send()")}} de l'objet XMLHttpRequest. Il utilise le même format qu'utilise un formulaire si le type d'encodage est mis à "multipart/form-data".

- -

Vous pouvez également le passer directement au constructeur {{domxref("URLSearchParams")}} si vous souhaitez générer des paramètres de requête de la même manière qu'un {{HTMLElement("form")}} le ferait s'il utilisait une simple soumission GET.

- -

Un objet implémentant FormData peut être utilisé directement dans une structure {{jsxref("Statements/for...of", "for...of")}}, au lieu de {{domxref('FormData.entries()', 'entries()')}} : for (var p of myFormData) est équivalent à for (var p of myFormData.entries()).

- -
-

Note : Cette fonctionnalité est disponible dans les Web Workers.

-
- -

Constructeur

- -
-
{{domxref("FormData.FormData","FormData()")}}
-
Crée un nouvel objet FormData.
-
- -

Méthodes

- -
-
{{domxref("FormData.append()")}}
-
Ajoute une nouvelle valeur à une clé existante dans un objet FormData, ou ajoute la clé si elle n'existe pas encore.
-
{{domxref("FormData.delete()")}}
-
Supprime une paire clé/valeur d'un objet FormData.
-
{{domxref("FormData.entries()")}}
-
Retourne une {{jsxref("Les_protocoles_iteration", "itération")}} permettant de passer en revue toutes les paires clé/valeur contenues dans cet objet.
-
{{domxref("FormData.get()")}}
-
Renvoie la première valeur associée à une clé donnée à partir d'un objet FormData.
-
{{domxref("FormData.getAll()")}}
-
Retourne un tableau de toutes les valeurs associées à une clé donnée à partir d'un FormData.
-
{{domxref("FormData.has()")}}
-
Renvoie un booléen indiquant si un objet FormData contient une certaine clé.
-
{{domxref("FormData.keys()")}}
-
Retourne une {{jsxref("Les_protocoles_iteration", "itération")}} permettant de parcourir toutes les clés des paires clé/valeur contenues dans cet objet.
-
{{domxref("FormData.set()")}}
-
Définit une nouvelle valeur pour une clé existante dans un objet FormData, ou ajoute la clé/valeur si elle n'existe pas encore.
-
{{domxref("FormData.values()")}}
-
Retourne une {{jsxref("Les_protocoles_iteration", "itération")}} permettant de parcourir toutes les clés des paires clé/valeur contenues dans cet objet.
-
- -

Spécifications

- - - - - - - - - - - - - - -
SpécificationStatutCommentaire
{{SpecName('XMLHttpRequest','#interface-formdata','FormData')}}{{Spec2('XMLHttpRequest')}}FormData définit dans les specs XHR
- - - -

Compatibilité des navigateurs

- - - -

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

- -

Voir aussi

- - diff --git a/files/fr/web/api/formdata/index.md b/files/fr/web/api/formdata/index.md new file mode 100644 index 0000000000..8fbf318e86 --- /dev/null +++ b/files/fr/web/api/formdata/index.md @@ -0,0 +1,87 @@ +--- +title: FormData +slug: Web/API/FormData +tags: + - API + - FormData + - Interface + - Reference + - XMLHttpRequest +translation_of: Web/API/FormData +--- +

{{APIRef("XMLHttpRequest")}}

+ +

L'interface FormData permet de construire facilement un ensemble de paires clé/valeur représentant les champs du formulaire et leurs valeurs, qui peuvent ensuite être facilement envoyées en utilisant la méthode {{domxref("XMLHttpRequest.send()")}} de l'objet XMLHttpRequest. Il utilise le même format qu'utilise un formulaire si le type d'encodage est mis à "multipart/form-data".

+ +

Vous pouvez également le passer directement au constructeur {{domxref("URLSearchParams")}} si vous souhaitez générer des paramètres de requête de la même manière qu'un {{HTMLElement("form")}} le ferait s'il utilisait une simple soumission GET.

+ +

Un objet implémentant FormData peut être utilisé directement dans une structure {{jsxref("Statements/for...of", "for...of")}}, au lieu de {{domxref('FormData.entries()', 'entries()')}} : for (var p of myFormData) est équivalent à for (var p of myFormData.entries()).

+ +
+

Note : Cette fonctionnalité est disponible dans les Web Workers.

+
+ +

Constructeur

+ +
+
{{domxref("FormData.FormData","FormData()")}}
+
Crée un nouvel objet FormData.
+
+ +

Méthodes

+ +
+
{{domxref("FormData.append()")}}
+
Ajoute une nouvelle valeur à une clé existante dans un objet FormData, ou ajoute la clé si elle n'existe pas encore.
+
{{domxref("FormData.delete()")}}
+
Supprime une paire clé/valeur d'un objet FormData.
+
{{domxref("FormData.entries()")}}
+
Retourne une {{jsxref("Les_protocoles_iteration", "itération")}} permettant de passer en revue toutes les paires clé/valeur contenues dans cet objet.
+
{{domxref("FormData.get()")}}
+
Renvoie la première valeur associée à une clé donnée à partir d'un objet FormData.
+
{{domxref("FormData.getAll()")}}
+
Retourne un tableau de toutes les valeurs associées à une clé donnée à partir d'un FormData.
+
{{domxref("FormData.has()")}}
+
Renvoie un booléen indiquant si un objet FormData contient une certaine clé.
+
{{domxref("FormData.keys()")}}
+
Retourne une {{jsxref("Les_protocoles_iteration", "itération")}} permettant de parcourir toutes les clés des paires clé/valeur contenues dans cet objet.
+
{{domxref("FormData.set()")}}
+
Définit une nouvelle valeur pour une clé existante dans un objet FormData, ou ajoute la clé/valeur si elle n'existe pas encore.
+
{{domxref("FormData.values()")}}
+
Retourne une {{jsxref("Les_protocoles_iteration", "itération")}} permettant de parcourir toutes les clés des paires clé/valeur contenues dans cet objet.
+
+ +

Spécifications

+ + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('XMLHttpRequest','#interface-formdata','FormData')}}{{Spec2('XMLHttpRequest')}}FormData définit dans les specs XHR
+ + + +

Compatibilité des navigateurs

+ + + +

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

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/formdata/keys/index.html b/files/fr/web/api/formdata/keys/index.html deleted file mode 100644 index 3b3b55c86c..0000000000 --- a/files/fr/web/api/formdata/keys/index.html +++ /dev/null @@ -1,79 +0,0 @@ ---- -title: FormData.keys() -slug: Web/API/FormData/keys -tags: - - API - - FormData - - Iteration - - Méthode - - Reference - - XHR - - XMLHttpRequestAPI - - keys -translation_of: Web/API/FormData/keys ---- -

{{APIRef("XMLHttpRequest")}}

- -

La méthode FormData.keys() renvoie une {{jsxref("Les_protocoles_iteration", "itération")}} permettant de parcourir toutes les clés contenues dans cet objet. Les clés sont des objets {{domxref("USVString")}}.

- -
-

Note : Cette méthode est disponible dans les Web Workers.

-
- -

Syntaxe

- -
formData.keys();
- -

Valeur de retour

- -

Retourne une {{jsxref("Les_protocoles_iteration", "itération")}}.

- -

Exemple

- -
// Créer un object FormData test
-var formData = new FormData();
-formData.append('cle1', 'valeur1');
-formData.append('cle2', 'valeur2');
-
-// Affiche les clés
-for (var key of formData.keys()) {
-   console.log(key);
-}
-
- -

Le résultat est :

- -
cle1
-cle2
- -

Spécifications

- - - - - - - - - - - - - - -
SpécificationStatutCommentaire
{{SpecName('XMLHttpRequest','#dom-formdata','keys() (as iterator<>)')}}{{Spec2('XMLHttpRequest')}}Définition initiale
- -

Compatibilité des navigateurs

- - - -

{{Compat("api.FormData.keys")}}

- -

Voir aussi

- - diff --git a/files/fr/web/api/formdata/keys/index.md b/files/fr/web/api/formdata/keys/index.md new file mode 100644 index 0000000000..3b3b55c86c --- /dev/null +++ b/files/fr/web/api/formdata/keys/index.md @@ -0,0 +1,79 @@ +--- +title: FormData.keys() +slug: Web/API/FormData/keys +tags: + - API + - FormData + - Iteration + - Méthode + - Reference + - XHR + - XMLHttpRequestAPI + - keys +translation_of: Web/API/FormData/keys +--- +

{{APIRef("XMLHttpRequest")}}

+ +

La méthode FormData.keys() renvoie une {{jsxref("Les_protocoles_iteration", "itération")}} permettant de parcourir toutes les clés contenues dans cet objet. Les clés sont des objets {{domxref("USVString")}}.

+ +
+

Note : Cette méthode est disponible dans les Web Workers.

+
+ +

Syntaxe

+ +
formData.keys();
+ +

Valeur de retour

+ +

Retourne une {{jsxref("Les_protocoles_iteration", "itération")}}.

+ +

Exemple

+ +
// Créer un object FormData test
+var formData = new FormData();
+formData.append('cle1', 'valeur1');
+formData.append('cle2', 'valeur2');
+
+// Affiche les clés
+for (var key of formData.keys()) {
+   console.log(key);
+}
+
+ +

Le résultat est :

+ +
cle1
+cle2
+ +

Spécifications

+ + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('XMLHttpRequest','#dom-formdata','keys() (as iterator<>)')}}{{Spec2('XMLHttpRequest')}}Définition initiale
+ +

Compatibilité des navigateurs

+ + + +

{{Compat("api.FormData.keys")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/formdata/set/index.html b/files/fr/web/api/formdata/set/index.html deleted file mode 100644 index 2174a28c4d..0000000000 --- a/files/fr/web/api/formdata/set/index.html +++ /dev/null @@ -1,92 +0,0 @@ ---- -title: FormData.set() -slug: Web/API/FormData/set -tags: - - API - - FormData - - Méthode - - Reference - - XHR - - XMLHttpRequest - - set -translation_of: Web/API/FormData/set ---- -

{{APIRef("XMLHttpRequest")}}

- -

La méthode set() de l'interface {{domxref("FormData")}} définit une nouvelle valeur pour une clé existante dans un objet FormData, ou ajoute la clé/valeur si elle n'existe pas encore.

- -

La différence entre set() et {{domxref("FormData.append")}} est que si la clé spécifiée existe déjà, set() écrasera toutes les valeurs existantes avec la nouvelle, tandis que {{domxref("FormData.append")}} ajoutera la nouvelle valeur à la fin de l'ensemble de valeurs existant.

- -
-

Note : Cette méthode est disponible dans les Web Workers.

-
- -

Syntaxe

- -

Il existe deux versions de cette méthode : une version à deux et une version à trois paramètres :

- -
formData.set(name, value);
-formData.set(name, value, filename);
- -

Paramètres

- -
-
name
-
Le nom du champ dont les données sont contenues en valeur (value).
-
value
-
La valeur du champ. Il peut s'agir d'un {{domxref("USVString")}} ou d'un {{domxref("Blob")}} (y compris les sous-classes telles que {{domxref("File")}}). Si aucune de ces sous-classes n'est spécifiée, la valeur est convertie en une chaîne de caractères.
-
filename {{optional_inline}}
-
Le nom de fichier communiqué au serveur (un {{domxref("USVString")}}), lorsqu'un {{domxref("Blob")}} ou un {{domxref("File")}} est passée comme deuxième paramètre. Le nom de fichier par défaut pour les objets {{domxref("Blob")}} est "blob". Le nom de fichier par défaut pour les objets {{domxref("File")}} est le nom du fichier.
-
- -
-

Note : Si vous spécifiez un {{domxref("Blob")}} comme donnée à ajouter à l'objet FormData, le nom du fichier qui sera rapporté au serveur dans l'en-tête "Content-Disposition" utilisé pour varier d'un navigateur à l'autre.

-
- -

Exemple

- -

La ligne suivante crée un objet FormData vide:

- -
var formData = new FormData(); // Actuellement vide
- -

Vous pouvez définir des paires clé/valeur à ce sujet en utilisant {{domxref("FormData.set")}} :

- -
formData.set('username', 'Chris');
-formData.set('userpic', myFileInput.files[0], 'chris.jpg');
- -

Si la valeur envoyée est différente de String ou Blob, elle sera automatiquement convertie en String :

- -
formData.set('name', 72);
-formData.get('name'); // "72"
- -

Spécifications

- - - - - - - - - - - - - - -
SpécificationStatutCommentaire
{{SpecName('XMLHttpRequest','#dom-formdata-set','set()')}}{{Spec2('XMLHttpRequest')}}
- -

Compatibilité des navigateurs

- - - -

{{Compat("api.FormData.set")}}

- -

Voir aussi

- - diff --git a/files/fr/web/api/formdata/set/index.md b/files/fr/web/api/formdata/set/index.md new file mode 100644 index 0000000000..2174a28c4d --- /dev/null +++ b/files/fr/web/api/formdata/set/index.md @@ -0,0 +1,92 @@ +--- +title: FormData.set() +slug: Web/API/FormData/set +tags: + - API + - FormData + - Méthode + - Reference + - XHR + - XMLHttpRequest + - set +translation_of: Web/API/FormData/set +--- +

{{APIRef("XMLHttpRequest")}}

+ +

La méthode set() de l'interface {{domxref("FormData")}} définit une nouvelle valeur pour une clé existante dans un objet FormData, ou ajoute la clé/valeur si elle n'existe pas encore.

+ +

La différence entre set() et {{domxref("FormData.append")}} est que si la clé spécifiée existe déjà, set() écrasera toutes les valeurs existantes avec la nouvelle, tandis que {{domxref("FormData.append")}} ajoutera la nouvelle valeur à la fin de l'ensemble de valeurs existant.

+ +
+

Note : Cette méthode est disponible dans les Web Workers.

+
+ +

Syntaxe

+ +

Il existe deux versions de cette méthode : une version à deux et une version à trois paramètres :

+ +
formData.set(name, value);
+formData.set(name, value, filename);
+ +

Paramètres

+ +
+
name
+
Le nom du champ dont les données sont contenues en valeur (value).
+
value
+
La valeur du champ. Il peut s'agir d'un {{domxref("USVString")}} ou d'un {{domxref("Blob")}} (y compris les sous-classes telles que {{domxref("File")}}). Si aucune de ces sous-classes n'est spécifiée, la valeur est convertie en une chaîne de caractères.
+
filename {{optional_inline}}
+
Le nom de fichier communiqué au serveur (un {{domxref("USVString")}}), lorsqu'un {{domxref("Blob")}} ou un {{domxref("File")}} est passée comme deuxième paramètre. Le nom de fichier par défaut pour les objets {{domxref("Blob")}} est "blob". Le nom de fichier par défaut pour les objets {{domxref("File")}} est le nom du fichier.
+
+ +
+

Note : Si vous spécifiez un {{domxref("Blob")}} comme donnée à ajouter à l'objet FormData, le nom du fichier qui sera rapporté au serveur dans l'en-tête "Content-Disposition" utilisé pour varier d'un navigateur à l'autre.

+
+ +

Exemple

+ +

La ligne suivante crée un objet FormData vide:

+ +
var formData = new FormData(); // Actuellement vide
+ +

Vous pouvez définir des paires clé/valeur à ce sujet en utilisant {{domxref("FormData.set")}} :

+ +
formData.set('username', 'Chris');
+formData.set('userpic', myFileInput.files[0], 'chris.jpg');
+ +

Si la valeur envoyée est différente de String ou Blob, elle sera automatiquement convertie en String :

+ +
formData.set('name', 72);
+formData.get('name'); // "72"
+ +

Spécifications

+ + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('XMLHttpRequest','#dom-formdata-set','set()')}}{{Spec2('XMLHttpRequest')}}
+ +

Compatibilité des navigateurs

+ + + +

{{Compat("api.FormData.set")}}

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/formdata/using_formdata_objects/index.html b/files/fr/web/api/formdata/using_formdata_objects/index.html deleted file mode 100644 index 93fc4bc977..0000000000 --- a/files/fr/web/api/formdata/using_formdata_objects/index.html +++ /dev/null @@ -1,148 +0,0 @@ ---- -title: Utilisation des objets FormData -slug: Web/API/FormData/Using_FormData_Objects -tags: - - AJAX - - Blob - - File - - FormData - - Formulaires - - XHR - - XMLHttpRequest -translation_of: Web/API/FormData/Using_FormData_Objects -original_slug: Web/API/FormData/Utilisation_objets_FormData ---- -

L’objet FormData vous permet de compiler un ensemble de paires clé/valeur à envoyer à l’aide de l’API XMLHttpRequest. Il est principalement destiné à l’envoi de données de formulaire, mais il peut également être utilisé indépendamment des formulaires pour transmettre des données indexées. Le format des données transmises est le même que celui qu’utiliserait la méthode {{domxref("HTMLFormElement.submit","submit()")}} du formulaire pour envoyer les données si l’encodage de ce dernier était défini sur multipart/form-data.

- -

Création intégrale d’un objet FormData

- -

Vous pouvez construire un objet FormData vous-même, en créer une instance, puis y ajouter des champs en appelant la méthode {{domxref("FormData.append","append()")}}, comme suit :

- -
var formData = new FormData();
-
-formData.append("username", "Groucho");
-formData.append("accountnum", 123456); // le numéro 123456 est converti immédiatement en chaîne "123456"
-
-// fichier HTML choisi par l'utilisateur
-formData.append("userfile", fileInputElement.files[0]);
-
-// objet JavaScript de type fichier
-var content = '<a id="a"><b id="b">hey!</b></a>'; // the body of the new file...
-var blob = new Blob([content], { type: "text/xml"});
-
-formData.append("webmasterfile", blob);
-
-var request = new XMLHttpRequest();
-request.open("POST", "http://foo.com/submitform.php");
-request.send(formData);
-
- -
-

Note : Les champs « userfile » et « webmasterfile » contiennent tous deux un fichier. Le numéro attribué au champ « accountnum » est immédiatement converti en chaîne par la méthode FormData.append() (la valeur du champ peut être un objet {{ domxref("Blob") }}, {{ domxref("File") }} ou une chaîne : s’il ne s’agit ni d’un objet Blob, ni d’un objet File, la valeur est convertie en chaîne).

-
- -

Dans cet exemple, une instance FormData contenant les valeurs des champs « username », « accountnum », « userfile » et « webmasterfile » est créée, puis la méthode XMLHttpRequest send() est utilisée pour envoyer les données du formulaire. Le champ « webmasterfile » est un objet {{domxref("Blob")}}. Un objet Blob représente un objet-fichier de données brutes immuables. Les Blobs représentent des données qui ne sont pas nécessairement dans un format JavaScript natif. L’interface {{ domxref("File") }} se base sur l’objet Blob, elle en hérite les fonctionnalités et les étend pour prendre en charge les fichiers du système de l’utilisateur. Pour construire un Blob, vous pouvez invoquer le {{domxref("Blob.Blob","constructeur Blob()")}}.

- -

Récupération d’un objet FormData dans un formulaire HTML

- -

Pour construire un objet FormData contenant les données d’un élément HTML {{ HTMLElement("form") }} existant, spécifiez cet élément lors de la création de l’objet :

- -
var formData = new FormData(someFormElement);
-
- -

Par exemple :

- -
var formElement = document.querySelector("form");
-var request = new XMLHttpRequest();
-request.open("POST", "submitform.php");
-request.send(new FormData(formElement));
-
- -

Vous pouvez également ajouter des données supplémentaires à l’objet FormData entre sa récupération dans un formulaire et son envoi, comme suit :

- -
var formElement = document.querySelector("form");
-var formData = new FormData(formElement);
-var request = new XMLHttpRequest();
-request.open("POST", "submitform.php");
-formData.append("serialnumber", serialNumber++);
-request.send(formData);
- -

Vous pouvez ainsi ajouter des données au formulaire avant de l’envoyer, pour y inclure des informations supplémentaires que les utilisateurs ne peuvent pas nécessairement modifier.

- -

Envoi de fichiers via un objet FormData

- -

L’objet FormData vous permet également d’envoyer des fichiers. Il vous suffit d’inclure un élément HTML {{ HTMLElement("input") }} de type file dans votre élément {{htmlelement("form")}} :

- -
<form enctype="multipart/form-data" method="post" name="fileinfo">
-  <label>Votre adresse électronique :</label>
-  <input type="email" autocomplete="on" autofocus name="userid" placeholder="email" required size="32" maxlength="64" /><br />
-  <label>Étiquette du fichier personnalisé :</label>
-  <input type="text" name="filelabel" size="12" maxlength="32" /><br />
-  <label>Fichier à mettre de côté :</label>
-  <input type="file" name="file" required />
-  <input type="submit" value="Mettez le fichier de côté." />
-</form>
-<div></div>
-
- -

Vous pouvez ensuite l’envoyer à l’aide du code suivant :

- -
var form = document.forms.namedItem("fileinfo");
-form.addEventListener('submit', function(ev) {
-
-  var oOutput = document.querySelector("div"),
-      oData = new FormData(form);
-
-  oData.append("CustomField", "Données supplémentaires");
-
-  var oReq = new XMLHttpRequest();
-  oReq.open("POST", "stash.php", true);
-  oReq.onload = function(oEvent) {
-    if (oReq.status == 200) {
-      oOutput.innerHTML = "Envoyé !";
-    } else {
-      oOutput.innerHTML = "Erreur " + oReq.status + " lors de la tentative d’envoi du fichier.<br \/>";
-    }
-  };
-
-  oReq.send(oData);
-  ev.preventDefault();
-}, false);
-
- -
-

Note : Si vous passez une référence dans le formulaire, la méthode spécifiée dans ce dernier sera utilisée au lieu de celle définie dans l’appel de la méthode open().

-
- -

Vous pouvez également ajouter un objet {{ domxref("File") }} ou {{ domxref("Blob") }} directement dans l’objet {{ domxref("FormData") }} :

- -
data.append("myfile", myBlob, "filename.txt");
-
- -

Avec la méthode {{domxref("FormData.append","append()")}}, vous pouvez utiliser le troisième paramètre facultatif pour passer un nom de fichier dans l’en-tête Content-Disposition envoyé au serveur. Si aucun nom de fichier n’est spécifié (ou si le paramètre n’est pas pris en charge), le nom « blob » est utilisé.

- -

Vous pouvez utiliser l’objet FormData avec jQuery si vous définissez les options appropriées :

- -
var fd = new FormData(document.querySelector("form"));
-fd.append("CustomField", "Données supplémentaires");
-$.ajax({
-  url: "stash.php",
-  type: "POST",
-  data: fd,
-  processData: false,  // dire à jQuery de ne pas traiter les données
-  contentType: false   // dire à jQuery de ne pas définir le contentType
-});
-
- -

Envoi de formulaires et de fichiers via AJAX sans objet FormData

- -

Si vous voulez en savoir plus sur la sérialisation des données  et l’envoi d’un formulaire via AJAX sans utiliser d’objets FormData, consultez ce paragraphe.

- -

Voir aussi

- - diff --git a/files/fr/web/api/formdata/using_formdata_objects/index.md b/files/fr/web/api/formdata/using_formdata_objects/index.md new file mode 100644 index 0000000000..93fc4bc977 --- /dev/null +++ b/files/fr/web/api/formdata/using_formdata_objects/index.md @@ -0,0 +1,148 @@ +--- +title: Utilisation des objets FormData +slug: Web/API/FormData/Using_FormData_Objects +tags: + - AJAX + - Blob + - File + - FormData + - Formulaires + - XHR + - XMLHttpRequest +translation_of: Web/API/FormData/Using_FormData_Objects +original_slug: Web/API/FormData/Utilisation_objets_FormData +--- +

L’objet FormData vous permet de compiler un ensemble de paires clé/valeur à envoyer à l’aide de l’API XMLHttpRequest. Il est principalement destiné à l’envoi de données de formulaire, mais il peut également être utilisé indépendamment des formulaires pour transmettre des données indexées. Le format des données transmises est le même que celui qu’utiliserait la méthode {{domxref("HTMLFormElement.submit","submit()")}} du formulaire pour envoyer les données si l’encodage de ce dernier était défini sur multipart/form-data.

+ +

Création intégrale d’un objet FormData

+ +

Vous pouvez construire un objet FormData vous-même, en créer une instance, puis y ajouter des champs en appelant la méthode {{domxref("FormData.append","append()")}}, comme suit :

+ +
var formData = new FormData();
+
+formData.append("username", "Groucho");
+formData.append("accountnum", 123456); // le numéro 123456 est converti immédiatement en chaîne "123456"
+
+// fichier HTML choisi par l'utilisateur
+formData.append("userfile", fileInputElement.files[0]);
+
+// objet JavaScript de type fichier
+var content = '<a id="a"><b id="b">hey!</b></a>'; // the body of the new file...
+var blob = new Blob([content], { type: "text/xml"});
+
+formData.append("webmasterfile", blob);
+
+var request = new XMLHttpRequest();
+request.open("POST", "http://foo.com/submitform.php");
+request.send(formData);
+
+ +
+

Note : Les champs « userfile » et « webmasterfile » contiennent tous deux un fichier. Le numéro attribué au champ « accountnum » est immédiatement converti en chaîne par la méthode FormData.append() (la valeur du champ peut être un objet {{ domxref("Blob") }}, {{ domxref("File") }} ou une chaîne : s’il ne s’agit ni d’un objet Blob, ni d’un objet File, la valeur est convertie en chaîne).

+
+ +

Dans cet exemple, une instance FormData contenant les valeurs des champs « username », « accountnum », « userfile » et « webmasterfile » est créée, puis la méthode XMLHttpRequest send() est utilisée pour envoyer les données du formulaire. Le champ « webmasterfile » est un objet {{domxref("Blob")}}. Un objet Blob représente un objet-fichier de données brutes immuables. Les Blobs représentent des données qui ne sont pas nécessairement dans un format JavaScript natif. L’interface {{ domxref("File") }} se base sur l’objet Blob, elle en hérite les fonctionnalités et les étend pour prendre en charge les fichiers du système de l’utilisateur. Pour construire un Blob, vous pouvez invoquer le {{domxref("Blob.Blob","constructeur Blob()")}}.

+ +

Récupération d’un objet FormData dans un formulaire HTML

+ +

Pour construire un objet FormData contenant les données d’un élément HTML {{ HTMLElement("form") }} existant, spécifiez cet élément lors de la création de l’objet :

+ +
var formData = new FormData(someFormElement);
+
+ +

Par exemple :

+ +
var formElement = document.querySelector("form");
+var request = new XMLHttpRequest();
+request.open("POST", "submitform.php");
+request.send(new FormData(formElement));
+
+ +

Vous pouvez également ajouter des données supplémentaires à l’objet FormData entre sa récupération dans un formulaire et son envoi, comme suit :

+ +
var formElement = document.querySelector("form");
+var formData = new FormData(formElement);
+var request = new XMLHttpRequest();
+request.open("POST", "submitform.php");
+formData.append("serialnumber", serialNumber++);
+request.send(formData);
+ +

Vous pouvez ainsi ajouter des données au formulaire avant de l’envoyer, pour y inclure des informations supplémentaires que les utilisateurs ne peuvent pas nécessairement modifier.

+ +

Envoi de fichiers via un objet FormData

+ +

L’objet FormData vous permet également d’envoyer des fichiers. Il vous suffit d’inclure un élément HTML {{ HTMLElement("input") }} de type file dans votre élément {{htmlelement("form")}} :

+ +
<form enctype="multipart/form-data" method="post" name="fileinfo">
+  <label>Votre adresse électronique :</label>
+  <input type="email" autocomplete="on" autofocus name="userid" placeholder="email" required size="32" maxlength="64" /><br />
+  <label>Étiquette du fichier personnalisé :</label>
+  <input type="text" name="filelabel" size="12" maxlength="32" /><br />
+  <label>Fichier à mettre de côté :</label>
+  <input type="file" name="file" required />
+  <input type="submit" value="Mettez le fichier de côté." />
+</form>
+<div></div>
+
+ +

Vous pouvez ensuite l’envoyer à l’aide du code suivant :

+ +
var form = document.forms.namedItem("fileinfo");
+form.addEventListener('submit', function(ev) {
+
+  var oOutput = document.querySelector("div"),
+      oData = new FormData(form);
+
+  oData.append("CustomField", "Données supplémentaires");
+
+  var oReq = new XMLHttpRequest();
+  oReq.open("POST", "stash.php", true);
+  oReq.onload = function(oEvent) {
+    if (oReq.status == 200) {
+      oOutput.innerHTML = "Envoyé !";
+    } else {
+      oOutput.innerHTML = "Erreur " + oReq.status + " lors de la tentative d’envoi du fichier.<br \/>";
+    }
+  };
+
+  oReq.send(oData);
+  ev.preventDefault();
+}, false);
+
+ +
+

Note : Si vous passez une référence dans le formulaire, la méthode spécifiée dans ce dernier sera utilisée au lieu de celle définie dans l’appel de la méthode open().

+
+ +

Vous pouvez également ajouter un objet {{ domxref("File") }} ou {{ domxref("Blob") }} directement dans l’objet {{ domxref("FormData") }} :

+ +
data.append("myfile", myBlob, "filename.txt");
+
+ +

Avec la méthode {{domxref("FormData.append","append()")}}, vous pouvez utiliser le troisième paramètre facultatif pour passer un nom de fichier dans l’en-tête Content-Disposition envoyé au serveur. Si aucun nom de fichier n’est spécifié (ou si le paramètre n’est pas pris en charge), le nom « blob » est utilisé.

+ +

Vous pouvez utiliser l’objet FormData avec jQuery si vous définissez les options appropriées :

+ +
var fd = new FormData(document.querySelector("form"));
+fd.append("CustomField", "Données supplémentaires");
+$.ajax({
+  url: "stash.php",
+  type: "POST",
+  data: fd,
+  processData: false,  // dire à jQuery de ne pas traiter les données
+  contentType: false   // dire à jQuery de ne pas définir le contentType
+});
+
+ +

Envoi de formulaires et de fichiers via AJAX sans objet FormData

+ +

Si vous voulez en savoir plus sur la sérialisation des données  et l’envoi d’un formulaire via AJAX sans utiliser d’objets FormData, consultez ce paragraphe.

+ +

Voir aussi

+ + diff --git a/files/fr/web/api/formdata/values/index.html b/files/fr/web/api/formdata/values/index.html deleted file mode 100644 index 7a5ddadcec..0000000000 --- a/files/fr/web/api/formdata/values/index.html +++ /dev/null @@ -1,79 +0,0 @@ ---- -title: FormData.values() -slug: Web/API/FormData/values -tags: - - API - - FormData - - Iteration - - Méthode - - Reference - - XHR - - XMLHttpRequestAPI - - values -translation_of: Web/API/FormData/values ---- -

{{APIRef("XMLHttpRequest")}}

- -

La méthode FormData.values() renvoie une {{jsxref("Les_protocoles_iteration", "itération")}} permettant de passer en revue toutes les valeurs contenues dans cet objet. Les valeurs sont des objets {{domxref("USVString")}} ou {{domxref("Blob")}}.

- -
-

Note : Cette méthode est disponible dans les Web Workers.

-
- -

Syntaxe

- -
formData.values();
- -

Valeur de retour

- -

Retourne une {{jsxref("Les_protocoles_iteration", "itération")}} .

- -

Exemple

- -
// Créer un objet FormData test
-var formData = new FormData();
-formData.append('cle1', 'valeur1');
-formData.append('cle2', 'valeur2');
-
-// Affiche les valeurs
-for (var value of formData.values()) {
-   console.log(value);
-}
-
- -

Le résultat est :

- -
valeur1
-valeur2
- -

Spécifications

- - - - - - - - - - - - - - -
SpécificationStatutCommentaire
{{SpecName('XMLHttpRequest','#dom-formdata','values() (as iterator<>)')}}{{Spec2('XMLHttpRequest')}}Définition initiale.
- -

Compatibilité des navigateurs

- - - -

{{Compat("api.FormData.values")}}

- -

Voir aussi

- - diff --git a/files/fr/web/api/formdata/values/index.md b/files/fr/web/api/formdata/values/index.md new file mode 100644 index 0000000000..7a5ddadcec --- /dev/null +++ b/files/fr/web/api/formdata/values/index.md @@ -0,0 +1,79 @@ +--- +title: FormData.values() +slug: Web/API/FormData/values +tags: + - API + - FormData + - Iteration + - Méthode + - Reference + - XHR + - XMLHttpRequestAPI + - values +translation_of: Web/API/FormData/values +--- +

{{APIRef("XMLHttpRequest")}}

+ +

La méthode FormData.values() renvoie une {{jsxref("Les_protocoles_iteration", "itération")}} permettant de passer en revue toutes les valeurs contenues dans cet objet. Les valeurs sont des objets {{domxref("USVString")}} ou {{domxref("Blob")}}.

+ +
+

Note : Cette méthode est disponible dans les Web Workers.

+
+ +

Syntaxe

+ +
formData.values();
+ +

Valeur de retour

+ +

Retourne une {{jsxref("Les_protocoles_iteration", "itération")}} .

+ +

Exemple

+ +
// Créer un objet FormData test
+var formData = new FormData();
+formData.append('cle1', 'valeur1');
+formData.append('cle2', 'valeur2');
+
+// Affiche les valeurs
+for (var value of formData.values()) {
+   console.log(value);
+}
+
+ +

Le résultat est :

+ +
valeur1
+valeur2
+ +

Spécifications

+ + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('XMLHttpRequest','#dom-formdata','values() (as iterator<>)')}}{{Spec2('XMLHttpRequest')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ + + +

{{Compat("api.FormData.values")}}

+ +

Voir aussi

+ + -- cgit v1.2.3-54-g00ecf