FormData()

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

Note: This feature is available in Web Workers.

O FormData() construtor cria um novo objeto FormData.

Nota: Este recurso está disponível em Web Workers.

Sintaxe

js
var formData = new FormData(form);

Parâmetros

form Optional

Um elemento HTML <form> — quando especifico, o objeto FormData será preenchido com as chaves/valores atuais do formulário usando a propriedade name de cada elemento para as chaves e seu valor enviado para os valores. Também condificará conteúdo de entrada do arquivo.

Exemplo

A linha a seguir cria um objeto FormData vázio:

js
var formData = new FormData(); // Currently empty

Você poderia adicionar uma chave/valor usando FormData.append:

js
formData.append("username", "Chris");

Ou você pode especificicar o opcional form argument ao criar o objeto FormData, para o popular com valores de forma especifica:

html
<form id="myForm" name="myForm">
  <div>
    <label for="username">Enter name:</label>
    <input type="text" id="username" name="username" />
  </div>
  <div>
    <label for="useracc">Enter account number:</label>
    <input type="text" id="useracc" name="useracc" />
  </div>
  <div>
    <label for="userfile">Upload file:</label>
    <input type="file" id="userfile" name="userfile" />
  </div>
  <input type="submit" value="Submit!" />
</form>

Nota: Todos os elementos de entrada têm um atributo 'name'. Para que possa acessar seus valores mais tarde.

js
var myForm = document.getElementById("myForm");
formData = new FormData(myForm);

Especificações

Specification
XMLHttpRequest Standard
# dom-formdata

Compatibilidade com navegadores

BCD tables only load in the browser

Veja também