aboutsummaryrefslogtreecommitdiff
path: root/files/fr/web/api/formdata/append/index.html
diff options
context:
space:
mode:
Diffstat (limited to 'files/fr/web/api/formdata/append/index.html')
-rw-r--r--files/fr/web/api/formdata/append/index.html98
1 files changed, 98 insertions, 0 deletions
diff --git a/files/fr/web/api/formdata/append/index.html b/files/fr/web/api/formdata/append/index.html
new file mode 100644
index 0000000000..f7c1e40a75
--- /dev/null
+++ b/files/fr/web/api/formdata/append/index.html
@@ -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
+---
+<p>{{APIRef("XMLHttpRequest")}}</p>
+
+<p>La méthode <code><strong>append()</strong></code> de l'interface {{domxref("FormData")}} ajoute une nouvelle valeur à une clé existante dans un objet <code>FormData</code>, ou rajoute cette clé et cette valeur quand elle n'existe pas.</p>
+
+<p>La différence entre {{domxref("FormData.set")}} et <code>append()</code> est que, quand la clé existe, {{domxref("FormData.set")}} va remplacer les valeurs existantes avec la nouvelle alors qu' <code>append()</code> va rajouter celle-ci à la fin de l'ensemble des valeurs existantes.</p>
+
+<div class="note">
+<p><strong>Note</strong>: Cette méthode est disponible dans les <a href="/en-US/docs/Web/API/Web_Workers_API">Web Workers</a>.</p>
+</div>
+
+<h2 id="Syntaxe">Syntaxe</h2>
+
+<p>Il y a deux versions de cette méthode : avec deux ou trois paramètres</p>
+
+<pre class="brush: js">formData.append(name, value);
+formData.append(name, value, filename);</pre>
+
+<h3 id="append_Parameters" name="append()_Parameters">Paramètres</h3>
+
+<dl>
+ <dt><code>name</code></dt>
+ <dd>Le nom de la clé dont les données sont contenues dans <code>value</code>.</dd>
+ <dt><code>value</code></dt>
+ <dd>La valeur du champ clé. Elle peut être une {{domxref("USVString")}} ou un {{domxref("Blob")}} (incluant les sous-classes comme {{domxref("File")}}).</dd>
+ <dt><code>filename </code>{{optional_inline}}</dt>
+ <dd>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.</dd>
+</dl>
+
+<div class="note">
+<p><strong>Note:</strong> Si vous spécifiez un  {{domxref("Blob")}} comme donnée rattachée à un objet de type <code>FormData</code>, le nom de fichier envoyé au serveur sera dans l'entête "Content-Disposition" mais peut varier selon le navigateur.</p>
+</div>
+
+<h3 id="Retours">Retours</h3>
+
+<p>Void.</p>
+
+<h2 id="Exemple">Exemple</h2>
+
+<p>La ligne suivante crée un objet <code>FormData</code> vide :</p>
+
+<pre class="brush: js">var formData = new FormData(); // Actuellement vide</pre>
+
+<p>Vous pouvez rajouter des paires clé/valeur en utilisant {{domxref("FormData.append")}}:</p>
+
+<pre class="brush: js">formData.append('username', 'Chris');
+formData.append('userpic', myFileInput.files[0], 'chris.jpg');</pre>
+
+<p>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é):</p>
+
+<pre class="brush: js">formData.append('userpic[]', myFileInput.files[0], 'chris1.jpg');
+formData.append('userpic[]', myFileInput.files[1], 'chris2.jpg');</pre>
+
+<p>Cette technique permet de simplement gérer l'envoi de plusieurs fichiers avec l'envoi d'une structure facilement itérable.</p>
+
+<h2 id="Spécifications">Spécifications</h2>
+
+<table class="standard-table">
+ <tbody>
+ <tr>
+ <th scope="col">Spécification</th>
+ <th scope="col">Statut</th>
+ <th scope="col">Commentaire</th>
+ </tr>
+ <tr>
+ <td>{{SpecName('XMLHttpRequest','#dom-formdata-append','append()')}}</td>
+ <td>{{Spec2('XMLHttpRequest')}}</td>
+ <td>Définition initiale</td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
+
+
+
+<p>{{Compat("api.FormData.append")}}</p>
+
+<h2 id="Voir_aussi">Voir aussi</h2>
+
+<ul>
+ <li>{{domxref("XMLHTTPRequest")}}</li>
+ <li><a href="/fr/docs/Web/API/XMLHttpRequest/Utiliser_XMLHttpRequest" title="Using XMLHttpRequest">Utiliser XMLHttpRequest</a></li>
+ <li><a href="/fr/docs/Web/API/FormData/Utilisation_objets_FormData" title="DOM/XMLHttpRequest/FormData/Using_FormData_objects">Utiliser les objets FormData</a></li>
+ <li>{{HTMLElement("Form")}}</li>
+</ul>