Bekerja dengan FormData di JavaScript

Misalkan kita memiliki suatu formulir:

<form action="/target/" method="POST">
	<input name="test1" value="123">
	<input name="test2" value="456">
	<input type="submit">
</form>

Misalkan kita ingin mendapatkan data formulir ini dalam bentuk pasangan kunci-nilai. Jelas, untuk itu kita harus menjalankan perulangan dan di dalamnya membentuk yang diinginkan. Di JavaScript, namun, ada cara yang lebih mudah - kita bisa menggunakan objek khusus FormData, yang memungkinkan untuk mendapatkan data formulir secara terurut.

Mari kita bahas cara bekerja dengan objek ini. Pertama-tama, dapatkan referensi ke formulir kita:

let form = document.querySelector('form');

Sekarang buat objek dengan formulir kita:

let formData = new FormData(form);

Kita bisa mencetak objek kita ke konsol, namun dengan pencetakan seperti itu, data formulir tidak akan terlihat:

console.log(formData);

Ubah objek kita menjadi array untuk melihat data formulir:

console.log(Array.from(formData));

Diberikan formulir dengan tiga input. Diberikan juga sebuah tombol. Saat tombol ditekan, dapatkan data formulir dalam bentuk objek FormData.