Thursday 29 December 2016

Mengenal Struktur Dasar Form HTML (atribut action dan method)


Mengenal Struktur Dasar Form HTML (atribut action dan method) Berikut adalah struktur dasar form sederhana dalam HTML:

<form action="proses.php" method="get">
   Nama: <input type="text" name="nama" />
   <br />
   E-Mail: <input type="text" name="email" />
   <br />
   <input type="submit" value="Proses Data" >
</form>

Jika anda menjalankan form HTML tersebut, akan ditampilkan form sederhana dengan 2  kotak inputan dan sebuah tombol “Proses Data” yang berfungsi untuk submit form. Dari struktur dasar tersebut, di dalam tag <form> terdapat 2 buah atribut. Yakni atribut action dan atribut method. Kita akan membahas kedua atribut ini secara lebih rinci.

Atribut pertama adalah action. Atribut action ini diisi dengan nilai berupa alamat halaman PHP dimana kita akan memproses isi form tersebut. Dalam contoh diatas, saya membuat nilai action=”proses.php”, yang berarti saya harus menyediakan sebuah file dengan nama: proses.php untuk memproses form tersebut.

Isi atribut action sebenarnya adalah alamat dari halaman PHP. Karena atribut action pada contoh diatas ditulis  action=”proses.php”, maka file proses.php harus berada di dalam 1 folder dengan halaman HTML yang berisi form ini. Namun anda bisa dengan bebas mengubah alamat proses.php ini tergantung dimana file tersebut berada, misalnya menjadi alamat relatif seperti action=”file_php/proses.php”, ataupun alamat absolut seperti action=”http://nama_web/proses.php”.

Atribut kedua yang berkaitan dengan pemrosesan form HTML adalah atribut method. Atribut inilah yang akan menentukan bagaimana cara form ‘dikirim’ ke dalam halaman proses.php. Nilai dari atribut method hanya bisa diisi dengan1 dari 2 pilihan, yakni get atau post.

Jika seperti contoh diatas saya membuat nilai method=”get”, maka nilai dari form akan dikirim melalui alamat URL website. Namun jika nilai method diubah menjadi method=”post”, maka nilai form tidak akan terlihat di dalam alamat URL. Perbedaan antara method get dan post akan kita bahas secara mendalam dalam tutorial selanjutnya. Nilai dari atribut method ini juga akan mempengaruhi cara kita memproses nilai dari form.

Setelah membuat tag pembuka form dengan atribut action dan method, isi form selanjutnya adalah 2 buah tag <input type=”text”> yang akan menampilkan kotak isian form. Hal yang paling penting diperhatikan adalah atribut name dari masing-masing tag <input>. Nilai dari name inilah yang menjadi penanda masing-masing objek form agar dapat diproses dengan PHP.

Setelah 2  text input, objek form terakhir adalah tombol submit yang apabila di klik akan mengirimkan data dari form ke halaman proses.php untuk diproses. Atribut penting disini adalah atribut type=”submit”, yang akan otomatis mengirim isian form ketika tombol ini di klik.
Load disqus comments

0 komentar