Lucrul cu FormData în JavaScript

Să presupunem că avem un formular:

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

Să presupunem că vrem să obținem datele acestui formular sub formă de perechi cheie-valoare. Este clar, că pentru aceasta va trebui să rulăm o buclă și în ea să formăm ceea ce ne dorim. În JavaScript, însă, există o metodă mai simplă - putem utiliza un obiect special FormData, care permite obținerea datelor formularului într-o manieră ordonată.

Să analizăm modul de lucru cu acest obiect. Pentru început, să obținem o referință la formularul nostru:

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

Acum să creăm un obiect cu formularul nostru:

let formData = new FormData(form);

Putem afișa obiectul nostru în consolă, însă cu o astfel de afișare nu vom vedea datele formularului:

console.log(formData);

Să transformăm obiectul nostru într-un array pentru a vedea datele formularului:

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

Este dat un formular cu trei input-uri. Este dat de asemenea un buton. La click pe buton, obțineți datele formularului sub forma obiectului FormData.