Setelah beberapa postingan tentang list dan tabel dalam pembuatan menggunakan tag HTML, kali ini kita akan membahas tentang inputan form menggunakan tag HTML. Pernahkah anda mendengar kata form? Apa yang terlintas dibenak anda jika anda mendengar kata form? Supaya anda tidak bingung, kita langsung saja ke pokok permasalahannya.
- Digunakan untuk mendapatkan masukkan dari pengunjung web.
- Pengunjung web (visitor) dapat memasukkan input melalui halaman-halaman HTML.
- Dalam satu form dapat terdiri dari beberapa inputan, yang akan dikirimkan ke server dalam satu saat
Pada intinya form itu digunakan untuk memberikan inputan ke web atau ke pemilik web yang kita kunjungi. Bermacam-macam bentuk form yang sering kita lihat di dalam halaman website yang dikunjungi, contoh yang paling simple saja misalnya form login facebook. Sebelum kita masuk kedalam halaman facebook yang kita miliki, kita harus menginputkan username dan password terlebih dahulu baru kita mengklik sebuah tombol login. Nah pada saat kita menginputkan username dan password serta mengklik tombol login itulah yang disebut dengan form. Form akan terdiri dari beberapa macam inputan. Ok! mari kita mulai belajar form.
1.Tag form
1
2
| <form name="“”" action="“url”" method="“post|get”"></form> |
Atribut ACTION tempat menspesifikasikan URL yang akan digunakan sebagai pemroses field input form. URL adalah lokasi dokumen yang akan melakukan proses terhadap input dari form. Methoddigunakan untuk menyatakan bagaimana masukkan-masukkan berasal dari form dikirimkan kepada program CGI. Method dibagi menjadi dua yaitu post untuk mengirimkan data, sedangkan get untuk mengambil data.
2. Tag Fieldset
1
| <fieldset>...</fieldset> |
Digunakan untuk memberikan garis tepi (batasan) pada sebuah kumpulan form.
3. Tag Legend
1
| <legend>...</legend> |
Digunakan untuk memberikan nama/identitas pada sebuah kumpulan form (keterangan dari fieldset).
4. Tag Label
1
| <label>...</label> |
Digunakan untuk memberikan nama/penjelasan pada sebuah inputan form.
5. Tag Text
1
| <input type="text" name="" value="" size="" maxlength=""> |
Digunakan untuk menginputkan text sebaris dari pengunjung web dalam sebuah form.
name digunakan untuk memberikan pengenal dari sebuah inputan. maxlength digunakan untuk memberikan batasan(limit) dalam penginputan karakter. value digunakan untuk memberikan nilai atau inputan secara otomatis.
name digunakan untuk memberikan pengenal dari sebuah inputan. maxlength digunakan untuk memberikan batasan(limit) dalam penginputan karakter. value digunakan untuk memberikan nilai atau inputan secara otomatis.
6. Tag Password
1
| <input type="password" name="" value="" size="" maxlength=""> |
Digunakan untuk menginputkan text sebaris berupa simbol dari pengunjung web dalam sebuah form.
name digunakan untuk memberikan pengenal dari sebuah inputan. maxlength digunakan untuk memberikan batasan(limit) dalam penginputan karakter. value digunakan untuk memberikan nilai atau inputan secara otomatis.
name digunakan untuk memberikan pengenal dari sebuah inputan. maxlength digunakan untuk memberikan batasan(limit) dalam penginputan karakter. value digunakan untuk memberikan nilai atau inputan secara otomatis.
7. Tag Radio
1
2
3
| <input type="radio" name="pilihan" value="">Pilihan 1<input type="radio" name="pilihan" value="">Pilihan 2<input type="radio" name="pilihan" value="">Pilihan 3 |
Pada inputan jenis radio button, pengunjung web hanya bisa memilih satu pilihan diantara beberapa pilihan. Isi name satu dengan pilihan yang lain nilainya harus sama. value digunakan untuk memberikan nilai atau inputan secara otomatis.
8. Tag Check box
1
2
3
| <input type="checkbox" name="pilihan1" value="">Pilihan 1<input type="checkbox" name="pilihan2" value="">Pilihan 2<input type="checkbox" name="pilihan3" value="">Pilihan 3 |
Pada form inputan jenis checkbox, pengunjung web dimungkinkan dapat memilih lebih dari satu pilihan.
Isi name satu dengan pilihan yang lain nilainya tidak boleh sama. value digunakan untuk memberikan nilai atau inputan secara otomatis.
Isi name satu dengan pilihan yang lain nilainya tidak boleh sama. value digunakan untuk memberikan nilai atau inputan secara otomatis.
9. Tag Combo box/drop down/select
1
2
3
4
5
| <select name="“pilihan”"><option value="">Pilihan 1</option><option value="">Pilihan 2</option><option value="">Pilihan 3</option></select> |
Pada form inputan jenis combo box, user hanya diperkenankan hanya memilih satu pilihan saja secara drop down. Berhubung pilihannya hanya bisa di pilih hanya satu saja maka name cukup dibutkan satu saja.
10. Tag Textarea
1
| <textarea name="" cols="" rows=""></textarea> |
Pada form jenis ini di gunakan untuk penanganan text yang terdiri dari lebih satu baris (multi line) atau menggunakan long text(beberapa kalimat). Attribute cols digunakan untuk menentukan ukuran lebar, sedangkan rows digunakan untuk menentukan ukuran tinggi dari sebuah inputan textarea.
11. Tag Submit button
1
| <input type="submit" name="" value=""> |
Tombol(button) yang digunakan untuk mengeksekusi (memproses) inputan-inputan yang ada di dalam form. value digunakan sebagai penamaan/nama dari sebuah tombol submit yang akan ditampilkan saat coding di preview.
12. Tag Reset button
1
| <input type="reset" name="" value=""> |
Tombol (button) yang digunakan untuk membersihkan/mengembalikan inputan-inputan dalam keadaan semula
value digunakan sebagai penamaan/nama dari sebuah tombol submit yang akan ditampilkan saat coding di preview.
value digunakan sebagai penamaan/nama dari sebuah tombol submit yang akan ditampilkan saat coding di preview.
13. Tag Image button
1
| <input type="image" src="lokasi_gambar/url" name="" value=""> |
Tombol (button) berupa gambar. Src digunakan untuk menentukan lokasi gambar.
Demikianlah penjelasan dari masing-masing jenis dari form yang ada. Silahkan di coba fungsi dan penggunaan untuk membuat sebuah form inputan.
