Mengenal HTML Bagian 9 : Form Pada HTML

Well, setelah sekian lama ngga ngeblog akhirnya sempat juga, disela sela menunggu dosen datang kekelas ada waktu sedikit buat nulis yang mungkin ini bermanfaat bagi teman teman sekalian. Baik, kali imi saya akan membagikan materi tentang Form, yang mana kita ketahui Form ini biasa nya digunakan untuk menginput data sebelum data tersebut di proses ke sistem. Ada beberapa form yang mungkin familiar bagi teman teman, diantaranya adalah Form Login, Comment, form data user atau yang lainnya. Untuk membuat tag form yakni seperti ini <form> dan didalam tag form ini ada berupa tag <input>, <text area>, <option> ataupun <select>.

 1. <form>

Tag ini sendiri adalah bingkai dari atribut atribut yang nanti akan dimasukkan kedalam tag form ini, dan juga dibutuhkan beberapa atribut untuk memproses data yang akan dikirim atau di proses. Biasanya nilai yang dikirim berupa alamat dari sebuah halaman yang memproses data inputan. Dan atribut yang kedua berupa method. Method ini menjelaskan bagaimana data yang dikirim oleh web browser. Nilai dari method ini biasanya POST atau GET, berikut Script HTML dari <form>

2. <input> 

Tag input merupakan tag yang akan digunakan dalam form pengisian. Tag input ini memiliki banyak sekali bentuk yang bisa digunakan misalkan isian teks, angka, check box, radiobutton sampai dengan tombol submit berada dalam tag input ini.

Beberapa bentuk atribut dalam tag input yang dibagikan dalam beberapa kategori berdasarkan atribut :

1. <input type="text"> textbox ini fungsinya menerima inputan text misalkan username atau nama atau berupa inputan text yang pendek.
2. <input type="password"> textbox ini berfungsi untuk menerima inputan text yang tampilannya sendiri akan berupa bintang bintang, artinya textbox ini berfungsi untuk inputan Password user.
3. <input type="submit"> inputan ini berupa tombol yang fungsinya untuk memproses data inputan dari form.
4. <input type="checkbox"> Inputan ini berupa checkbox yang dapat di ceklist oleh user.
5. <input type="radio"> Inputan ini berupa radiogrup yang mana user dapat memilih salah satu dari piliuhan yang disediakan. Salah satu contoh penggunaanya adalah Jenis Kelamin.

3. Tag <select>

tag ini merupakan tag yang digunakan oleh user untuk memilih data yang disediakan. Dalam penggunaanna tag ini selalu diikuti oleh tag <option> yang mana tag option ini digunakan untuk membuat pilihan. Dibawah ini adalah contoh penggunaan dasar dari tag select.

4. Tag <textarea>

Tag ini merupakan tag yang fungsinya adalah inputan text, hanya saja pada pada textarea ini dapat diisikan dengan lebih banyak teks didalamnya. Dibawah ini adalah penggunaan dasar dari tag <textarea>

5. Atribut Name

Setiap tag inputan didalam form harus ditambahkan atribut name agar dapat diproses oleh web server nantinya. Didalam halaman proses yang biasanya berupa bahasa PHP atau ASP nilai dari atribut inilah yang akan menjadi variable form nya. Contoh pemakaian atribut name seperti dibawah ini :

Ketiga inputan diatas akan tampak sama persis namun saat pemrosesan data masing masing akan dibedakan menurut atribut name.

Nah sekarang kita coba membuat sebuah form utuh. Gimana sih caranya ? Script nya ada dibawah ini :

Nah untuk tampilannya seperti gambar dibawah ini

Dari semua diatas itu adalah HTML murni, artinya tanpa campuran css, css itu adalah sebuah bahasa scripting untuk mempercantik tampilan web kalian, nah berhubung diatas belum memakai css jadi tampilan formnya masih sangat tidak enak dioandang hehehe.

Sekian dari saya sampai ketemu lagi di part berikutnya. Berhubung ini admin mendekati UAS wkwk kayaknya jarang posting di blog. Terima kasih yang sudah berkunjung, dan jika ada ynag ditanyakan bisa di tanya di kolom komentar