Dalam
form, kita dapat membuat input atau kotak isian yang dapat diisi dengan suatu
data oleh user. Tag yang digunakan untuk membuat kotak isian adalah tag
<INPUT>. Tipe-tipe input yang tersedia adalah sebagai berikut :
1. Type=TEXT
Kotak
isian bertipe teks ini menerima data karakter (default) sebanyak satu baris.
Jenis- Jenis Atribut
pada Input Field Tipe Text
Atribut
|
Deskripsi
|
Name
|
Nama variable dari control yang akan
menyimpan nilai dari input field
|
Type
|
<INPUT TYPE=”TEXT”>
|
Value
|
Untuk
memberikan value ke input field
|
Size
|
Jumlah
karakter dari input field
|
Maxlength
|
jumlah
karakter maksimum untuk input field
|
Contoh :
<INPUT TYPE=”TEXT”
NAME=”textbox1” VALUE=”” SIZE=”20”>
2. TYPE=PASSWORD
Kotak
isian bertipe password ini menerima data karakter, tapi tidak akan ditampilkan
karena kebutuhan masukan password yang bersifat rahasia. Atribut nya sama
dengan input field type text.
Contoh :
<INPUT
TYPE="PASSWORD" NAME="PWD" VALUE="" SIZE=”20”>
3. TYPE=CHECKBOX
Suatu
inputan yang memungkinkan kita memilih satu atau lebih pilihan atau tidak
memilih sama sekali, dengan memberikan tanda pada checkbox tersebut.
Jenis-Jenis Atribut
pada Input Field Tipe Checkbox
Atribut
|
Deskripsi
|
Checked
|
Untuk memberi default check
|
Name
|
Nama variable dari control yang akan
menyimpan nilai dari input field
|
Type
|
<INPUT TYPE=”CHECKBOX”>
|
Value
|
Untuk memberikan
value ke input
|
Size
|
Ukuran
control
|
4. TYPE=RADIO
Hanya
mengijinkan memilih satu dari banyak pilihan. Setiap radio button control harus
memiliki nama yang sama, sehingga user hanya bisa memilih satu option saja.
Radio button juga harus secara explisit memberikan nilai ke atribut value.
jenis-Jenis Atribut
pada Input Field Tipe Radio
Atribut
|
Deskripsi
|
Checked
|
Untuk memberi default check
|
Name
|
Nama variable dari control yang akan
menyimpan nilai dari input field
|
Type
|
<INPUT TYPE=”RADIO”>
|
Value
|
Untuk
memberikan value ke input
|
Size
|
Ukuran
control
|
5.
TYPE=BUTTON
Jenis-Jenis Atribut
pada Input Field Tipe Button
Atribut
|
Deskripsi
|
Name
|
Nama variable dari kontrol yang akan
menyimpan nilai dari input field
|
Type
|
<INPUT TYPE=”SUBMIT”> : Mengirimkan
form ke URL yang telah didefinisikan pada atribut ACTION pada tag <FORM>
<INPUT TYPE=”RESET”> : Browser
mengembalikan field dalam form ke dalam nilai default(mengosongkan nilai
semua elemen form).
|
Value
|
Memberikan nama label pada button
|
Size
|
Menentukan
lebar button
|
Contoh
:
<INPUT
TYPE="RESET" NAME="RESET" VALUE="RESET">
6. Tag <TEXTAREA>
Tag
ini digunakan untuk membuat input teks yang lebar, bisa menampung lebih banyak
karakter dibanding input field bertipe TEXT.
Teks
yang berada diantara tag <TEXTAREA> dan </TEXTAREA> secara default
akan ditampilkan sesuai aslinya.
Jenis-Jenis Atribut
pada Input Tipe Textarea
Attribute
|
Deskripsi
|
Name
|
Nama variable dari control yang akan menyimpan
nilai dari input field
|
Rows
|
Jumlah
baris
|
Cols
|
Lebar
kolom text area
|
Wrap
|
WRAP=PHYSICAL
– tampilan word-wraps. Default WRAP=OFF
|
Contoh :
<HTML>
<TEXTAREA NAME=”text1”
COLS=20 rows=5></TEXTAREA>
</HTML>
7. TYPE=IMAGE NAME=SUBMIT SRC=”…”
Mengirimkan
informasi form seperti halnya tombol Submit, hanya berbentuk gambar.
Contoh
:
<INPUT
TYPE="IMAGE" NAME="SUBMIT" SRC="submit.jpg">
8. Tag
<SELECT> dan <OPTIONS>
Digunakan
untuk membuat input field yang berbentuk pilihan. Tag <SELECTION> dan
<OPTION> ini harus digunakan secara bersama-sama. Tag <OPTION> ini
mendefinisikan pilihan dari item-item. Tag ini dipasangkan diantara tag
<SELECT> dan </SELECT>.
Jenis-Jenis Atribut
Pada Input Field Tipe Select
Atribut
|
Deskripsi
|
Name
|
Nama variable dari control yang akan
menyimpan nilai dari input field
|
Value
|
Teks yang ditampilkan pada tombol, default = “Submit
Query”
|
Size
|
Untuk menentukan jumlah baris yang di tampilkan
|
Multiple
|
Untuk menentukan apakah user boleh memilih lebih
dari satu option atau
tidak.
|
Selected
|
Pilihan ini dipilih secara default.
|
Contoh
:
<select
name="job" size="1">
<option value="1">Web
Developer</option>
<option value="2">Web
Designer</option>
<option value="3"
selected>Web Administrator</option>
<option value="4">Web
Database</option>
</select>
0 comments:
Post a Comment