Metode Pengiriman Formulir dalam JavaScript

Formulir dapat dikirim dengan dua cara: metode GET atau metode POST. Cara pengiriman formulir diatur oleh atribut method formulir.

Sebagai contoh, tentukan metode pengiriman GET untuk formulir:

<form action="/handler/" method="GET">
	<input name="test1">
	<input name="test2">
	<input type="submit">
</form>

Dan sekarang metode POST:

<form action="/handler/" method="POST">
	<input name="test1">
	<input name="test2">
	<input type="submit">
</form>

Sekarang mari kita lihat, apa perbedaan antara dua metode pengiriman ini. Dalam kasus metode GET, data formulir akan terlihat di browser dalam bentuk yang disebut string parameter (query string), yang merupakan pasangan berbentuk kunci-nilai, di mana kuncinya adalah nama elemen formulir, dan nilainya adalah data yang dimasukkan ke dalamnya. Pasangan nilai tersebut akan dipisahkan oleh tanda ampersand.

Data yang dikirim dengan metode GET akan masuk ke server kita dalam properti get objek berisi data:

export default {
	'/handler/': function(data) {
		console.log(data.get); // akan tercetak di konsol server
		return 'form data received';
	}
}

Sedangkan data yang dikirim dengan metode POST akan masuk ke server kita dalam properti post objek berisi data:

export default {
	'/handler/': function(data) {
		console.log(data.post); // akan tercetak di konsol server
		return 'form data received';
	}
}

Untuk singkatnya, kita dapat melakukan destrukturisasi, untuk mendapatkan data kita ke dalam variabel terpisah:

export default {
	'/handler/': function({get, post}) {
		console.log(get);
		console.log(post);
		return 'form data received';
	}
}