Apa itu Form pada HTML dan Cara Membuatnya

Pada tutorial ini kita akan membahas tentang apa itu Form pada HTML dan bagaimana cara membuatnya pada halaman website?. Form digunakan untuk menyimpan data pengunjung yang mereka inputkan, dan dalam penggunaannya melibatkan bahasa pemrograman server seperti PHP misalnya. Pada proses pembuatan Form ada banyak elemen yang biasa dimasukkan seperti penggunaan textarea, input, legend, button dan penggunaan elemen lainnya. Seperti pada table di bawah ini.

Nama Tag Kegunaan
<form> Mendefinisikan pembuatan Form
<input> Tag ini adalah tag yang sudah pasti selalu digunakan, karena di dalamnya dapat dimasukan radio, checkbox, kotak dialog dll.
<textarea> Digunakan untuk memasukan informasi dalam jumlah banyak.
<fieldset> Untuk mengelompokan form sesuai kegunaannya untuk apa.
<legend> Memberi nama pada form tersebut.
<label> Memudahkan pengisian form dengan cara mengarahkan mouse pada teks.
<select> Membuat menu dropdown yang berisi item – item pilihan.
<option> Mendefinisikan item – item pilihan pada tag <select>
<optgroup> Mendefinisikan judul grup dari item – item pilihan.
<button> Mendefinisikan Tombol submit untuk memproses form.

Di bawah ini adalah beberapa atribut pada tag Form yang sering digunakan…

Nama Atribut Kegunaan
Name Mendefinisikan nama form
Method Mendefinisikan data pada form akan dikirim dengan cara apa, GET atau POST
Action Mendefinisikan alamat URL, dimana file pemroses seperti file PHP misalnya, disimpan.
Target Menentukan akan seperti apa Form yang menjadi target tujuan ditampilkan.

Sebuah form lengkap…

Dan gambar di bawah ini adalah hasilnya :

apa itu form pada html

Dalam pembuatan Form, umumnya para Developer menyusunnya dengan table, baris demi baris dan kolom demi kolom, serta menambahkan style CSS agar Form tampil dengan rapi dan indah. Namun, disini penulis sengaja menampilkannya murni.


Demikian tutorial dari apa itu Form pada HTML dan bagaimana cara membuatnya. Silahkan kunjungi tutorial HTML 5 lainnya seperti Cara membuat Canvas pada HTML5, Ragam elemen semantic pada HTML5 dan Cara penulisan HTML5.

Leave a comment

Your email address will not be published. Required fields are marked *

× Contact Us