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 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 for...of structure, instead of entries(): for (var p of myFormData) is equivalent to for (var p of myFormData.entries()).
Note: This feature is available in Web Workers.
Constructor
FormData()- Creates a new
FormDataobject.
Methods
FormData.append()- Appends a new value onto an existing key inside a
FormDataobject, or adds the key if it does not already exist. FormData.delete()- Deletes a key/value pair from a
FormDataobject. FormData.entries()- Returns an
iteratorallowing to go through all key/value pairs contained in this object. FormData.get()- Returns the first value associated with a given key from within a
FormDataobject. FormData.getAll()- Returns an array of all the values associated with a given key from within a
FormData. FormData.has()- Returns a boolean stating whether a
FormDataobject contains a certain key/value pair. FormData.keys()- Returns an
iteratorallowing to go through all keys of the key/value pairs contained in this object. FormData.set()- Sets a new value for an existing key inside a
FormDataobject, or adds the key/value if it does not already exist. FormData.values()- Returns an
iteratorallowing to go through all values of the key/value pairs contained in this object.
Specifications
| Specification | Status | Comment |
|---|---|---|
| XMLHttpRequest The definition of 'FormData' in that specification. |
Living Standard | FormData defined in XHR spec |
Browser compatibility
| Feature | Chrome | Edge | Firefox (Gecko) | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|---|
| Basic support | 7.0 | (Yes) | 4.0 (2.0)[1] | 10 | 12 | 5 |
| append with filename | (Yes) | No support | 22.0 (22.0) | ? | (Yes) | ? |
delete(), get(), getAll(), has(), set() |
50.0 | No support | 39.0 (39.0) | No support | (Yes) | No support |
entries(), keys(), values(), and support of for...of |
50.0 | No support | 44.0 (44.0) | ? | (Yes) | No support |
| Available in web workers | (Yes) | (Yes) | 39.0 (39.0) | No support | (Yes) | No support |
| Feature | Android | Android Webview | Edge | Firefox Mobile (Gecko) | Firefox OS (Gecko) | IE Mobile | Opera Mobile | Safari Mobile | Chrome for Android |
|---|---|---|---|---|---|---|---|---|---|
| Basic support | 3.0[2] | (Yes)[2] | (Yes) | 4.0 (2.0)[1] | 1.0.1 | ? | 12 | ? | (Yes) |
| append with filename | ? | (Yes) | No support | 22.0 (22.0) | 1.2 | ? | ? | ? | (Yes) |
delete(), get(), getAll(), has(), set() |
(Yes) | 50.0 | No support | No support | No support | No support | No support | No support | 50.0 |
entries(), keys(), values(), and support of for...of |
? | 50.0 | No support | 44.0 (44.0) | 2.5 | ? | ? | ? | 50.0 |
| Available in web workers | (Yes) | (Yes) | (Yes) | (Yes) | (Yes) | No support | (Yes) | No support | (Yes) |
[1] Prior to Gecko 7.0 (Firefox 7.0 / Thunderbird 7.0 / SeaMonkey 2.4), if you specified a 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] XHR in Android 4.0 sends empty content for FormData with blob.