1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
|
---
title: FormData
slug: Web/API/FormData
translation_of: Web/API/FormData
---
<p>{{APIRef("XMLHttpRequest")}}</p>
<p>A interface <strong><code>FormData</code></strong> fornece uma maneira fácil de construir um conjunto de pares chave/valor representando campos de um elemento f<code>orm</code> e seus valores, os quais podem ser facilmente enviados utilizado o método <a href="/pt-BR/docs/DOM/XMLHttpRequest#send()" title="XMLHttpRequest#send()"><code>send()</code></a> do XMLHttpRequest. Essa interface utiliza o mesmo formato que um <code>form</code> utilizaria se o tipo de codificação estivesse configurado como "multipart/form-data".</p>
<p>Um objeto <code>FormData</code> pode ser usado diretamente em uma estrutura {{jsxref("Statements/for...of", "for...of")}} em vez de {{domxref('FormData.entries()', 'entries()')}}: <code>for (var p of myFormData) </code>é o mesmo que <code>for (var p of myFormData.entries())</code>.</p>
<div class="note">
<p><strong>Nota</strong>: Esse recurso está disponível em <a href="https://developer.mozilla.org/pt-BR/docs/Web/API/Web_Workers_API">https://developer.mozilla.org/pt-BR/docs/Web/API/Web_Workers_API</a></p>
</div>
<h2 id="Syntax" name="Syntax">Construtor</h2>
<dl>
<dt>{{domxref("FormData.FormData","FormData()")}}</dt>
<dd>Cria um novo objeto <code>FormData</code>.</dd>
</dl>
<h2 id="Métodos">Métodos</h2>
<dl>
<dt>{{domxref("FormData.append")}}</dt>
<dd>Acrescenta um novo valor em uma chave existente dentro de um objeto <code>FormData</code>, ou adiciona a chave se ela ainda não existir.</dd>
<dt>{{domxref("FormData.delete")}}</dt>
<dd>Apaga um par chave/valor de um objeto <code>FormData</code>.</dd>
<dt>{{domxref("FormData.get")}}</dt>
<dd>Retorna o primeiro valor associado com uma dada chave de dentro de um objeto <code>FormData</code>.</dd>
<dt>{{domxref("FormData.getAll")}}</dt>
<dd>Retorna uma matriz de todos os valores associados a uma determinada chave de dentro de um <code>FormData</code>.</dd>
<dt>{{domxref("FormData.has")}}</dt>
<dd>Retorna um valor boleano indicando se um objeto <code>FormData</code> contém um certo par chave/valor.</dd>
<dt>{{domxref("FormData.set")}}</dt>
<dd>Define um novo valor para uma chave existente dentro de um objeto <code>FormData</code>, ou adiciona a chave/valor se ele ainda não existir.</dd>
</dl>
<div class="note">
<p><strong>Nota</strong>: Para ser claro, a diferença entre {{domxref("FormData.set()")}} e {{domxref("FormData.append()")}} é que, se a chave especificada não existir, {{domxref("FormData.set()")}} irá substituir o valor existente por um novo, enquanto {{domxref("FormData.append()")}} irá acrescentar um novo valor no final dos valores existentes. Veja as suas páginas dedicadas para código de exemplo.</p>
</div>
<h2 id="Especificações">Especificações</h2>
<table class="standard-table">
<tbody>
<tr>
<th scope="col">Especificação</th>
<th scope="col">Status</th>
<th scope="col">Comentário</th>
</tr>
<tr>
<td>{{SpecName('XMLHttpRequest','#interface-formdata','FormData')}}</td>
<td>{{Spec2('XMLHttpRequest')}}</td>
<td>FormData definido na especificação XHR</td>
</tr>
</tbody>
</table>
<h2 id="Compatibilidade_com_navegadores">Compatibilidade com navegadores</h2>
<div>{{CompatibilityTable}}</div>
<div id="compat-desktop">
<table class="compat-table">
<tbody>
<tr>
<th>Característica</th>
<th>Chrome</th>
<th>Firefox (Gecko)</th>
<th>Internet Explorer</th>
<th>Opera</th>
<th>Safari</th>
</tr>
<tr>
<td>Suporte básico</td>
<td>7+</td>
<td>{{CompatGeckoDesktop("2.0")}}</td>
<td>10+</td>
<td>12+</td>
<td>5+</td>
</tr>
<tr>
<td>append com filename</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatGeckoDesktop("22.0")}}</td>
<td>10+</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
</tr>
<tr>
<td>delete, get, getAll, has, set</td>
<td>Behind Flag</td>
<td>{{CompatNo}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatNo}}</td>
</tr>
</tbody>
</table>
</div>
<div id="compat-mobile">
<table class="compat-table">
<tbody>
<tr>
<th>Característica</th>
<th>Android</th>
<th>Chrome for Android</th>
<th>Firefox Mobile (Gecko)</th>
<th>Firefox OS (Gecko)</th>
<th>IE Mobile</th>
<th>Opera Mobile</th>
<th>Safari Mobile</th>
</tr>
<tr>
<td>Suporte básico</td>
<td>3.0</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatGeckoMobile("2.0")}}</td>
<td>1.0.1</td>
<td>{{CompatUnknown}}</td>
<td>
<p>12+</p>
</td>
<td>{{CompatUnknown}}</td>
</tr>
<tr>
<td>append com filename</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatGeckoDesktop("22.0")}}</td>
<td>1.2</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
<td>{{CompatUnknown}}</td>
</tr>
<tr>
<td>delete, get, getAll, has, set</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatNo}}</td>
<td>{{CompatVersionUnknown}}</td>
<td>{{CompatNo}}</td>
</tr>
</tbody>
</table>
</div>
<div class="note">
<p><strong>Nota</strong>: XHR in Android 4.0 envia conteúdo vazio para o FormData com blob.</p>
<p><strong>Nota:</strong> Suporte do Chrome aos métodos que não seja append está atualmente atrás da bandeira "Enable Experimental Web Platform Features".</p>
</div>
<h3 id="Notas_da_Gecko">Notas da Gecko</h3>
<p>Antes do Gecko 7.0 {{geckoRelease("7.0")}}, se você especificasse um {{domxref("Blob")}} como o dado a ser anexado ao objeto, o nome do arquivo relatado no cabeçalho HTTP "Content-Disposition" era uma string vazia; isso resultou em erros sendo relatados por alguns servidores. Começando em Gecko 7.0, o nome do arquivo "blob" é enviado.</p>
<h2 id="Veja_também">Veja também</h2>
<ul>
<li>{{domxref("XMLHTTPRequest")}}</li>
<li><a href="/pt-BR/docs/DOM/XMLHttpRequest/Using_XMLHttpRequest" title="Using XMLHttpRequest">Usando XMLHttpRequest</a></li>
<li><a href="/pt-BR/docs/DOM/XMLHttpRequest/FormData/Using_FormData_Objects" title="DOM/XMLHttpRequest/FormData/Using_FormData_objects">Usando objetos FormData</a></li>
<li>{{HTMLElement("Form")}}</li>
</ul>
|
