Cataloged AutobiographyBERKENAAN SAYA  Hello. Saya adalah self-taught web designer yang banyak menghabiskan masa meneroka penggunaan CSS dan HTML. Blogging hanyalah hobi. Teruskan membaca.. | The Readable Journal MENEROKA ARTIKEL  Teroka artikel berhubung dengan tutorial, contoh dan penggunaan CSS dan HTML dalam web design di ruang ini. Web design menyeronokan. Ke tutorial...Klik sini | Astrolab Tool KATEGORI ARTIKEL  Suatu sistem yang berfungsi untuk membantu menjelajahi topik-topik terkait dan menyenaraikan pelbagai sub-bahagian artikel...Klik sini |
 FORM ATAU BORANG |
| September 1, 2008 Posted by: Fauzie |
"Form" element atau Borang adalah element yang membolehkan pengguna memasukkan maklumat ke dalam sesuatu Borang atau Form.
Terdapat beberapa jenis atau bentuk borang: textbox, textarea, drop-down menus, radio button, checkboxes, file form, submit form, reset form dan lain-lain.
Tag untuk Form ialah <form>. "Attribute"nya ditentukan oleh tag <input>.
Di bawah ini adalah contoh-contoh Form dan kod HTML.
Textbox atau Text field
<form>
Nama Pertama:
<input type="text" value="namapertama">
<br>
Nama Akhir:
<input type="text" value="namaahkir">
</form>
Nama Pertama:
<input type="text" value="namapertama">
<br>
Nama Akhir:
<input type="text" value="namaahkir">
</form>
Di bawah ini adalah bentuk form yang menggunakan kod HTML di atas.
Radio Button
<form>
<input type="radio" name="jantina" value="laki-laki">Laki-Laki
<br>
<input type="radio" name="jantina" value="perempuan">Perempuan
</form>
<input type="radio" name="jantina" value="laki-laki">Laki-Laki
<br>
<input type="radio" name="jantina" value="perempuan">Perempuan
</form>
Jika anda taip kod HTML di atas di dalam text editor (Notepad) dan kemudian "open file" di browser, form yang akan anda dapati adalah seperti di bawah ini:
Laki-Laki
Perempuan
Checkbox
Checkbox disediakan jika anda hendak pengguna membuat pemilihan lebih daripda satu pilihan. Contoh kod HTML untuk membuat "Checkbox Form" adalah seperti berikut:
<form>
Saya ada basikal:
<input type="checkbox" name="kenderaan" value="basikal">
<br>
Saya ada kereta:
<input type="checkbox" name="kenderaan" value="kereta">
<br>
Saya ada motosikal:
<input type="checkbox" name="kenderaan" value="kereta">
</form>
Saya ada basikal:
<input type="checkbox" name="kenderaan" value="basikal">
<br>
Saya ada kereta:
<input type="checkbox" name="kenderaan" value="kereta">
<br>
Saya ada motosikal:
<input type="checkbox" name="kenderaan" value="kereta">
</form>
Di bawah ini ialah contoh form "checkbox" dalam browser apabila kita menggunakan kod HTML di atas:
Submit Button
<form name="input" action="html_form_action.asp" method="get">
username:
<input type="text" name="user">
<input type="submit" value="submit">
</form>
username:
<input type="text" name="user">
<input type="submit" value="submit">
</form>
Username:
Textarea
Contoh ini menggunakan "textarea" dan ianya tidak boleh diedit.
<textarea rows="10" cols="40"<There are many species of birds at Kuala Lumpur Bird Park</textarea>
Fieldset
Di bawah ini adalah kod HTML untuk satu contoh "fieldset"
<fieldset>
<lagend>
Maklumat Anda:
</lagend>
<form action="">
Tinggi: <input size="20" type="text">
Berat : <input size="20" type="text">
</form>
</fieldset>
<lagend>
Maklumat Anda:
</lagend>
<form action="">
Tinggi: <input size="20" type="text">
Berat : <input size="20" type="text">
</form>
</fieldset>
Nota: Jika "border" tidak kelihatan dikeliling form di atas, anda mungkin menggunakan sistem browser lama
klik sini untuk kembali ke kandungan tutorial
