HTML Form Atribut Fungsi

jika kalian ingin membuat sebuah HTML Form, maka salah satu hal yang perlu kalian ketahui adalah Atribut dan fungsi pada html form tersebut.

Pengertian dan Fungsi Atribut pada HTML Form

sebelumnya coba perhatikanlah terlebih dahulu contoh kode dibawah ini.

<form action="contoh_action.php" method="get">
First name:<br>
<input type="text" name="nama depan" value="Mulia">
<br><br>
Last name:<br>
<input type="text" name="nama belakang" value="Alvanof">
<br><br>
<input type="submit" value="Submit">
</form>

adapun contoh kode diatas akan menghasilkan form seperti dibawah ini

First name:

Last name:

Pada contoh diatas, terdapat 3 buah atribut yaitu Action attribute, method attribute, dan juga name attribute yang tentunye meiliki fungsi mereka masing-masing

1. Action Attribute

Pada HTML Form, Action Attribute berfungsi untuk mendefinisikan apa tindakan yang akan dilakukan saat form dikirimkan.

Secara sederhana dapat diartikan, akan dieksekusi dan atau dibawa kemana data yang telah diinput saat tombol submit di klik.

<form action="contoh_action.php">

pada contoh diatas, saat tombol submit di klik maka data akan dibawa atau ditangani oleh halaman contoh_action.php

2. Method Attribute

ada dua macam method, GET dan POST, apa bedanya ? pada GET Method, pengiriman data akan bersifat pasif, sehingga data yang kamu input untuk dikirimkan pada form akan terlihat pada adress bar, yang mana method GET ini biasanya dipakai pada mesin pencari.

Untuk mendekatkan paham, sebagai contoh saat saya mencari "Android" di situs carimul ini, maka keyword pencarian yang diinput akan muncul pada adress bar.

Sedangkan POST method digunakan untuk data yang sifatnya sensitif, password misalnya, tujuannya tentu agar tidak begitu saja muncul di adress bar.

3. Name Attribute

Pada HTML Form, Name Attribute terdapat pada elemen input, yang mana fungsinya agar data dapat dikirimkan secara valid. begitu juga sebaliknya, jika name attribut tidak dicantumkan, maka data tidak akan dapat di proses oleh action form.

Share this post