Form HTML dan User Input

Sebelumnya -- Berikutnya
--------------------------------------------------------------------------------

Form HTML digunakan untuk memilih input berbeda.

--------------------------------------------------------------------------------

Forms

Sebuah form adalah sebuah area yang berisi elemen form.

Elemen form adalah elemen yang memperbolehkan user untuk menuliskan informasi (seperti text box, text area, menu drop-down, tombol pilihan, checkbox, dll.) di sebuah form.

Sebuah form dituliskan dengan tag <form>.

<form>
<input>
<input>
</form>

--------------------------------------------------------------------------------

Input

Tag Form yang paling sering digunakan adalah tag <input>. Jenis input diberikan pada atribut tag. Jenis Input yang sering digunakan dijelaskan di bawah ini.

Text Fields

Text fields digunakan jika kamu ingin user mengetikkan text, angka, dll. di sebuah form.

<form>
First name:
<input type="text" name="firstname">
<br>
Last name:
<input type="text" name="lastname">
</form>

Bagaimana itu ditampilkan di browser:

Perhatikan bahwa form itu sendiri tidak terlihat. Perhatikan juga di kebanyakan browser, lebar text field dasarnya sepanjang 20 karakter.

Radio Buttons

Radio Buttons digunakan ketika kamu ingin user memilih satu dari beberapa pilihan.

<form>
<input type="radio" name="sex" value="male"> Male
<br>
<input type="radio" name="sex" value="female"> Female
</form>

Bagaimana itu ditampilkan di browser:

Perhatikan bahwa hanya satu pilihan yang bisa dipilih.

Checkboxes

Checkboxes digunakan ketika kamu ingin user memilih satu atau lebih dari pilihan yang ada.

<form>
I have a bike:
<input type="checkbox" name="vehicle" value="Bike">
<br>
I have a car:
<input type="checkbox" name="vehicle" value="Car">
<br>
I have an airplane:
<input type="checkbox" name="vehicle" value="Airplane">
</form>

Bagaimana itu ditampilkan di browser:

--------------------------------------------------------------------------------

Atribut Form dan Tombol Submit

Ketika user menekan tombol "Submit", isi dari form akan dikirim ke file lain. Atribut form menentukan nama file untuk dikirimi. File tersebut biasanya berhubungan dengan input yang diterima.

<form name="input" action="html_form_action.asp"
method="get">
Username:
<input type="text" name="user">
<input type="submit" value="Submit">
</form>

Bagaimana itu ditampilkan di browser:

Jika kamu menuliskan beberapa karakter di text field di atas, dan klik tombol "submit", kamu akan mengirim input ke sebuah halaman yang disebut "html_form_action.asp". Halaman tersebut akan menunjukkan input yang diterima.

--------------------------------------------------------------------------------

Tag Form

Tag	Deskripsi
<form>	Menunjukkan sebuah form untuk user input
<input>	Menunjukkan kotak input
<textarea>	Menunjukkan area text (input text multi-baris)
<label>	Memberikan label pada kontrol
<fieldset>	Menunjukkan fieldset
<legend>	Memberikan judul untuk fieldset
<select>	Menunjukkan list yang bisa dipilih (dropdown menu)
<optgroup>	Menunjukkan grup pilihan
<option>	Menunjukkan pilihan dari sebuah drop-down menu
<button>	Menunjukkan sebuah tombol

--------------------------------------------------------------------------------
Sebelumnya -- Berikutnya
--------------------------------------------------------------------------------

Pilih Style
untuk halaman ini