Form
Form adalah suatu cara untuk mejadikan halaman web menjadi lebih interaktif , karena akan mendaptakan umpan balik dari pengunjung situs web. Form dapat digunakan untuk membuat buku tamu, formulir pemesanan, survey, meminta komentar dan lain sebagianya.
Adapun cara untuk membuat form adalah dengan menggunakan elemen FORM kemudian ditambah dengan komponen-komponen pembentuk form seperti input, checkbox, option dan sebagainya.
Perintah untuk membuat form yaitu :
<FORM [METHOD=”POST/GET” ACTION=”URL”>
<INPUT>
<INPUT>
</FORM>
Method digunakan untuk menentukan bagaimana form diberlakukan, sedang action sering diisi dengan URL tempat pemrosesan form selankjutnya.
Elemen-elemen pada Form
Bagian berikut menerangkan elemen-elemen yang dapat ditempatkan dalam suatu form :
Elemen | Atribut | fungsi |
INPUT | TYPE | Bentuk masukan. Diisi dengan TEXT atau PASSWORD |
NAME | Nama komponen input | |
VALUE | Isi/nilai dari komponen input | |
SIZE | Panjang komponen input | |
MAXLENGTH | Batasan panjang penulisan isi input | |
INPUT | TYPE | Bentuk masukan RADIO |
NAME | Nama komponen input radio | |
VALUE | Pemberian nilai pada radio | |
CHEKED | Memilih salah satu radio | |
INPUT | TYPE | Bentuk masukan CHECKBOX |
NAME | Nama komponen input checkbox | |
VALUE | Pemberian nilai pada checkbox | |
CHEKED | Memilih checkbox | |
SELECT | NAME | Nama komponen select /pull down list |
OPTION | Pilihan dalam list | |
VALUE | Isi pada list | |
SELECTED | Option yang dipilih | |
SIZE | Ukuran list | |
TEXTAREA | TYPE | Bentuk komponen TEXTAREA |
NAME | Nama komponen textarea | |
ROWS | Jumlah baris pada textarea | |
COLS | Jumlah kolom pada textarea | |
INPUT | TYPE | Bentuk masukan tombol. Diisi dengan SUBMIT atau RESET |
VALUE | Judul pada tombol |
Contoh pembuatan form
<HTML>
<HEAD>
<TITLE>Contoh Membuat Form</TITLE></HEAD>
<BODY>
<H1 ALIGN="CENTER">FORM PENDAFTARAN ONLINE</H1>
<HR size=3 color="black">
<FORM METHOD="POST" ACTION="contohform.htm">
<TABLE>
<TR>
<TD><B>Nama :</B></TD>
<TD><INPUT TYPE="Text" NAME="varNama" SIZE="15"></TD>
</TR>
<TR>
<TD><B>Alamat :</B></TD>
<TD><INPUT TYPE="Text" NAME="varAlamat" SIZE="30"></TD>
</TR>
<TR>
<TD><B>Agama :</B></TD>
<TD><SELECT NAME="agama" SIZE="1">
<OPTION>Islam</OPTION>
<OPTION>Kristen</OPTION>
<OPTION>Budha</OPTION>
<OPTION>Hindu</OPTION>
</SELECT> </TD>
</TR>
<TR>
<TD><B>Password :</B></TD>
<TD><INPUT TYPE="Password" NAME="varPassword" SIZE="10"></TD>
</TR>
</TABLE>
<B>Jenis kelamin: </B><INPUT CHECKED TYPE="Radio" NAME="Kelamin" VALUE="Pria">Pria
<INPUT TYPE="Radio" NAME="Kelamin" VALUE="Wanita">Wanita
<BR>
<B>Hobi:</B><BR>
<INPUT TYPE="Checkbox" NAME="Kelamin" VALUE="Soccer">Sepakbola
<INPUT CHECKED TYPE="Checkbox" NAME="Hobi" VALUE="Badminton">Bulutangkis
<INPUT TYPE="Checkbox" NAME="Hobi" VALUE="Computer">Komputer <BR>
<INPUT TYPE="Checkbox" NAME="Hobi" VALUE="Game">Permainan video
<INPUT CHECKED TYPE="Checkbox" NAME="Hobi" VALUE="Internet">Internet
<BR>
<B>Komentar</B><BR>
<TEXTAREA Cols="30" Rows="5" Name="komentar"></TEXTAREA><BR>
<INPUT TYPE="Submit" VALUE="Send info"> <INPUT TYPE="Reset" VALUE="Clear form">
</FORM>
</BODY>
</HTML>
0 comments:
Post a Comment