FormData

  • Revision slug: DOM/XMLHttpRequest/FormData
  • Revision title: FormData
  • Revision id: 12861
  • Created:
  • Creator: Kabe
  • Is current revision? No
  • Comment 6 words added, 6 words removed

Revision Content

XMLHttpRequest Level 2 adds support for the new FormData interface. FormData objects provide a way to easily construct a set of key/value pairs representing form fields and their values, which can then be easily sent using the XMLHttpRequest send() method.

For details on how to use the FormData object, see Using FormData objects.

Syntax

new FormData ([in HTMLFormElement form])

Parameters

form
(optional) HTML Form Element <form> to send for keys/values. It will also encode file input content.

 

Method overview

void append(in DOMString name, in {{ interface("nsIVariant") }} value);

Methods

append()

Appends a key/value pair to the FormData object.

void append(
  in DOMString name,
  in nsIVariant value
); 
Parameters
name
The name of the field whose data is contained in value.
value
The field's value. Can be a {{ domxref("Blob") }}, {{ domxref("File") }}, or a string, if neither, the value is converted to a string.
Notes

If you specify a {{ domxref("Blob") }} as the data to append to the FormData object, the filename that will be reported to the server in the "Content-Disposition" header will vary from browser to browser. See the {{ anch("Browser compatibility") }} section for details.

See also

Browser compatibility

{{ CompatibilityTable() }}

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support 7+ {{ CompatGeckoDesktop("2.0") }} 10+ {{ CompatUnknown() }} 5+
Feature Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support 3.0 {{ CompatGeckoMobile("2.0") }} {{ CompatUnknown() }} {{ CompatUnknown() }} {{ CompatUnknown() }}

Gecko notes

Prior to Gecko 7.0 {{ geckoRelease("7.0") }}, if you specified a {{ domxref("Blob") }} as the data to append to the object, the filename reported in the "Content-Disposition" HTTP header was an empty string; this resulted in errors being reported by some servers. Starting in Gecko 7.0, the filename "blob" is sent.

{{ languages( { "en": "en/DOM/XMLHttpRequest/FormData", "ja": "ja/DOM/XMLHttpRequest/FormData" } ) }}

Revision Source

<p>XMLHttpRequest Level 2 adds support for the new <code>FormData</code> interface. <code>FormData</code> objects provide a way to easily construct a set of key/value pairs representing form fields and their values, which can then be easily sent using the XMLHttpRequest <a href="/en/DOM/XMLHttpRequest#send()" title="en/XMLHttpRequest#send()"><code>send()</code></a> method.</p>
<p>For details on how to use the <code>FormData</code> object, see <a href="/en/DOM/XMLHttpRequest/Using_XMLHttpRequest#Using_FormData_objects" title="en/XMLHttpRequest/Using XMLHttpRequest#Using FormData objects">Using FormData objects</a>.</p>
<h2 name="Syntax">Syntax</h2>
<p><code>new FormData ([in </code><code>HTMLFormElement form</code><code>])</code></p>
<h2 name="Parameters">Parameters</h2>
<dl> <dt><code>form</code></dt> <dd>(optional) HTML Form Element &lt;form&gt; to send for keys/values. It will also encode file input content.</dd>
</dl>
<p> </p>
<h2 name="Method_overview">Method overview</h2>
<table class="standard-table"> <tbody> <tr> <td><code>void <a href="/en/DOM/XMLHttpRequest/FormData#append()" title="en/DOM/XMLHttpRequest/FormData#append()">append</a>(in DOMString name, in {{ interface("nsIVariant") }} value);</code></td> </tr> </tbody>
</table>
<h2>Methods</h2>
<h3>append()</h3>
<p>Appends a key/value pair to the <code>FormData</code> object.</p>
<pre>void append(
  in DOMString name,
  in nsIVariant value
); 
</pre>
<h6>Parameters</h6>
<dl> <dt><code>name</code></dt> <dd>The name of the field whose data is contained in <code>value</code>.</dd> <dt><code>value</code></dt> <dd>The field's value. Can be a {{ domxref("Blob") }}, {{ domxref("File") }}, or a string, if neither, the value is converted to a string.</dd>
</dl>
<h6>Notes</h6>
<p>If you specify a {{ domxref("Blob") }} as the data to append to the <code>FormData</code> object, the filename that will be reported to the server in the "Content-Disposition" header will vary from browser to browser. See the {{ anch("Browser compatibility") }} section for details.</p>
<h2>See also</h2>
<ul> <li><a href="/en/DOM/XMLHttpRequest" title="en/XMLHttpRequest">XMLHttpRequest</a></li> <li><a href="/en/DOM/XMLHttpRequest/Using_XMLHttpRequest" title="En/Using XMLHttpRequest">Using XMLHttpRequest<br> </a></li> <li><a href="/en/DOM/XMLHttpRequest/Using_XMLHttpRequest#Using_FormData_objects" title="en/XMLHttpRequest/Using XMLHttpRequest#Using FormData
    objects">Using FormData objects</a></li> <li><a href="/en/HTML/Element/form" title="en/HTML/Element/form"><code>form</code></a></li>
</ul>
<h2>Browser compatibility</h2>
<p>{{ CompatibilityTable() }}</p>
<div id="compat-desktop"> <table class="compat-table"> <tbody> <tr> <th>Feature</th> <th>Chrome</th> <th>Firefox (Gecko)</th> <th>Internet Explorer</th> <th>Opera</th> <th>Safari</th> </tr> <tr> <td>Basic support</td> <td>7+</td> <td>{{ CompatGeckoDesktop("2.0") }}</td> <td>10+</td> <td>{{ CompatUnknown() }}</td> <td>5+</td> </tr> </tbody> </table>
</div>
<div id="compat-mobile"> <table class="compat-table"> <tbody> <tr> <th>Feature</th> <th>Android</th> <th>Firefox Mobile (Gecko)</th> <th>IE Mobile</th> <th>Opera Mobile</th> <th>Safari Mobile</th> </tr> <tr> <td>Basic support</td> <td>3.0</td> <td>{{ CompatGeckoMobile("2.0") }}</td> <td>{{ CompatUnknown() }}</td> <td>{{ CompatUnknown() }}</td> <td>{{ CompatUnknown() }}</td> </tr> </tbody> </table>
</div>
<h3>Gecko notes</h3>
<p>Prior to Gecko 7.0 {{ geckoRelease("7.0") }}, if you specified a {{ domxref("Blob") }} as the data to append to the object, the filename reported in the "Content-Disposition" HTTP header was an empty string; this resulted in errors being reported by some servers. Starting in Gecko 7.0, the filename "blob" is sent.</p>
<p>{{ languages( { "en": "en/DOM/XMLHttpRequest/FormData", "ja": "ja/DOM/XMLHttpRequest/FormData" } ) }}</p>
Revert to this revision