{{APIRef("XMLHttpRequest")}}
The FormData
interface provides 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 {{domxref("XMLHttpRequest.send()")}} method. It uses the same format a form would use if the encoding type were set to "multipart/form-data"
.
An object implementing FormData
can directly be used in a {{jsxref("Statements/for...of", "for...of")}} structure, instead of {{domxref('FormData.entries()', 'entries()')}}: for (var p of myFormData)
is equivalent to for (var p of myFormData.entries())
.
Note: This feature is available in Web Workers.
Constructor
- {{domxref("FormData.FormData","FormData()")}}
- Creates a new
FormData
object.
Methods
- {{domxref("FormData.append()")}}
- Appends a new value onto an existing key inside a
FormData
object, or adds the key if it does not already exist. - {{domxref("FormData.delete()")}}
- Deletes a key/value pair from a
FormData
object. - {{domxref("FormData.entries()")}}
- Returns an {{jsxref("Iteration_protocols","iterator")}} allowing to go through all key/value pairs contained in this object.
- {{domxref("FormData.get()")}}
- Returns the first value associated with a given key from within a
FormData
object. - {{domxref("FormData.getAll()")}}
- Returns an array of all the values associated with a given key from within a
FormData
. - {{domxref("FormData.has()")}}
- Returns a boolean stating whether a
FormData
object contains a certain key/value pair. - {{domxref("FormData.keys()")}}
- Returns an {{jsxref("Iteration_protocols", "iterator")}} allowing to go through all keys f the key/value pairs contained in this object.
- {{domxref("FormData.set()")}}
- Sets a new value for an existing key inside a
FormData
object, or adds the key/value if it does not already exist. - {{domxref("FormData.values()")}}
- Returns an {{jsxref("Iteration_protocols", "iterator")}} allowing to go through all values of the key/value pairs contained in this object.
Specifications
Specification | Status | Comment |
---|---|---|
{{SpecName('XMLHttpRequest','#interface-formdata','FormData')}} | {{Spec2('XMLHttpRequest')}} | FormData defined in XHR spec |
Browser compatibility
Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|
Basic support | 7[2] | {{CompatGeckoDesktop("2.0")}}[1] | 10 | 12 | 5 |
append with filename | {{CompatVersionUnknown}} | {{CompatGeckoDesktop("22.0")}} | {{CompatUnknown}} | {{CompatUnknown}} | {{CompatUnknown}} |
delete() , get() , getAll() , has() , set() |
Behind Flag | {{CompatGeckoDesktop("39.0")}} | {{CompatNo}} | {{CompatVersionUnknown}} | {{CompatNo}} |
entries() , keys() , values() , and support of for...of |
{{CompatUnknown}} | {{CompatGeckoDesktop("44.0")}} | {{CompatUnknown}} | {{CompatUnknown}} | {{CompatUnknown}} |
Available in web workers | {{CompatVersionUnknown}} | {{CompatGeckoDesktop("39.0")}} | {{CompatNo}} | {{CompatVersionUnknown}} | {{CompatNo}} |
Feature | Android | Chrome for Android | Firefox Mobile (Gecko) | Firefox OS (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|---|---|
Basic support | 3.0 | {{CompatUnknown}}[3] | {{CompatGeckoMobile("2.0")}}[1] | 1.0.1 | {{CompatUnknown}} | 12 | {{CompatUnknown}} |
append with filename | {{CompatUnknown}} | {{CompatUnknown}} | {{CompatGeckoMobile("22.0")}} | 1.2 | {{CompatUnknown}} | {{CompatUnknown}} | {{CompatUnknown}} |
delete() , get() , getAll() , has() , set() |
{{CompatVersionUnknown}} | {{CompatVersionUnknown}} | {{CompatNo}} | {{CompatNo}} | {{CompatNo}} | {{CompatVersionUnknown}} | {{CompatNo}} |
entries() , keys() , values() , and support of for...of |
{{CompatUnknown}} | {{CompatUnknown}} | {{CompatGeckoMobile("44.0")}} | 2.5 | {{CompatUnknown}} | {{CompatUnknown}} | {{CompatUnknown}} |
Available in web workers | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} | {{CompatVersionUnknown}} | {{CompatNo}} | {{CompatVersionUnknown}} | {{CompatNo}} |
[1] 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 from Gecko 7.0, the filename "blob" is sent.
[2] Chrome support for methods other than append is currently behind the "Enable Experimental Web Platform Features" flag.
[3] XHR in Android 4.0 sends empty content for FormData
with blob
.
See also
- {{domxref("XMLHTTPRequest")}}
- Using XMLHttpRequest
- Using FormData objects
- {{HTMLElement("Form")}}