FormData.append("key", "value") is not working

Question

Can you tell me whats wrong with this: ``` var formdata = new FormData(); formdata.append("key", "value"); console.log(formdata); ``` My output looks like this, I cant find my "key" - "value" pair ``` FormData *__proto__: FormData **append: function append() { [native code] } ***arguments: null ***caller: null ***length: 0 ***name: "append" ***prototype: append ***__proto__: function Empty() {} *constructor: function FormData() { [native code] } **arguments: null **caller: null **length: 0 **name: "FormData" **prototype: FormData **toString: function toString() { [native code] } *__proto__: Object **__proto__: Object **__defineGetter__: function __defineGetter__() { [native code] } **__defineSetter__: function __defineSetter__() { [native code] } **__lookupGetter__: function __lookupGetter__() { [native code] } **__lookupSetter__: function __lookupSetter__() { [native code] } **constructor: function Object() { [native code] } **hasOwnProperty: function hasOwnProperty() { [native code]…

Accepted Answer

New in Chrome 50+ and Firefox 39+ (resp. 44+):

- `formdata.entries()` (combine with `Array.from()` for debugability)

- `formdata.get(key)`

- and more very useful methods

Original answer:

What I usually do to 'debug' a `FormData` object, is just send it (anywhere!) and check the browser logs (eg. Chrome devtools' Network tab).

You don't need a/the same Ajax framework. You don't need any details. Just send it:

```
var xhr = new XMLHttpRequest;
xhr.open('POST', '/', true);
xhr.send(data);
```

Easy.

FormData.append("key", "value") is not working

Solution

Problem