HTML – FORMS

Form Elements

Form pada HTML dapat memiliki 1 atau lebih kontrol berikut ini:

  • Text boxesInput ini menerima masukan berupa text pendek.

1

  • Check boxes: Input untuk menangani 1 atau lebih option yang dapat dipilih oleh user dengan cukup mengklik checkbox.

2

  • Radio buttonsInput RADIO terdiri dari beberapa input CHECKBOX yang dikelompokkan dalam satu grup dan hanya bisa dipilh salah satu saja.

3

  • Combo boxes/Select/Dropdown ListBerfungsi untuk memberikan pilihan bagi pengguna dalam memilih pilihan yang telah disediakan dalam bentuk drop-down list.

4

  • Text Area:  Input untuk memasukkan teks yang relatif panjang dan bisa berisi banyak baris.

5

  • Submit buttonBerfungsi mengirim data pada form ke server dengan tampilan tombol. Biasanya form memiliki submit button.

6

  • Password boxes: Input untuk menerima text yang sifatnya rahasia seperti password. Ketika diisikan text, text yang kita masukkan akan ditampilkan berupa bintang atau bulat hitam.

7

  • Reset button: tombol yang digunakan untuk menhapus data yang dimasukkan dan mengembalikannya pada value awal.

8

  • Hidden field: mirip seperti text boxes, namun text pada hidden field tidak akan terlihat pada halaman.

10.JPG

Form adalah area yang mengandung form element yang digunakan untuk  membuat GUI pada halaman Web dan mendapatkan informasi dari user yang dikirim ke server.

  • Syntax = <form parameter>…form element….</form>
  • Parameter form akan memberitahu JSP bagaimana mengirim informasi ke server (ada 2 cara)

 

How to Code a Form

9

Argument pada form HTML seperti <form argument></form> memberitahu apa yang dilakukan dengan input dari user, yaitu :

  • action =”url”     (diperlukan)
    • menentukan di mana data akan dikirimkan ketika submit button diklik
  • method = “get”     (default)
    • menampilkan data/nilai pada url yang kemudian akan ditampung oleh action dan tidak boleh lebih dari 2047 karakter
  • method =”post”
    • mengirimkan data atau nilai langsung ke action untuk ditampung tanpa menampilkannya pada url dan tidak bisa di-bookmark oleh browser.
  • target =”target”
    • target=_blankmembuka pada window baru jika submit button diklik
    • target =_top, menggunakan window yang sama

Example

11

12

Result

13

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s