FORM
Tidak terasa sudah sampai untuk membuat FORM, terasa cepat sekali, mungkin ini akan menjadi pembahasan terakhir dengan HTML, tapi akan ke jenjang berikutnya, yaitu CSS, tapi sabar dulu, aku bahas dulu tentang FORM.
FORM<FORM>
Tag form digunakan untuk menampung tag - tag input untuk dimasukkan kedalam server, seperti textbox, checkbox,dll. Form sering kali digunakan untuk halaman - halaman yang digunakan untuk sebuah pendaftaran, seperti pendaftaran pekerjaan, sekolah, dll. Sekian keterangan dari tag form, kita lihat Atribut apa saja pada form, yaitu :
Sintaks :
<Form
NAME="name“, digunakan untuk memberi nama pada iframe
ACTION="name“, lokasi tujuan yang akan memproses data pada elemen-elemen input pada form
METHOD="
GET | POST“, Metode pengiriman pada form
>...</Form>
Tambahan :
GET = pada metode ini pengiriman dilakukan tanpa melakukan enkripsi, dan data yang dikirim akan muncul pada ADDRESS BAR
POST = pada metode ini pengiriman dilakukan melakukan enkripsi, dan data yang dikirim tidak akan muncul pada ADDRESS BAR
Tag - Tag yang ada dalam tag form yaitu :
1. Textbox <input type="text">
Digunakan untuk memasukkan input berupa text. Atributnya :
size ="angka", Ukuran dari text box dalam karakter, default 20
maxlength ="angka" , Maksimal banyaknya karakter yang diterima
name ="nama" , Nama dari elemen yang dikirim ke suatu aplikasi
value="huruf | angka" ,Akan menampilkan isinya sebagai nilai default
Digunakan untuk memasukkan password. Attributnya :
size ="angka", Ukuran dari text box dalam karakter, default 20
maxlength ="angka", Maksimal banyaknya karakter yang diterima
name ="nama" , Nama dari elemen yang dikirim ke suatu aplikasi
7. Select<Select>...</Select>
Digunakan untuk combo box, tetapi akan ada isinya apabila didalam tag <select> diberi tag <option> . Attribut dari tag<select> :
SIZE="angka", Jumlah isi yang dapat terlihat secara langsung
NAME = "nama" , Nama dari elemen yang akan dikirim ke suatu aplikasi
Attribut dari tag <option>:
2. Password <input type="password">
Digunakan untuk memasukkan password. Attributnya :
size ="angka", Ukuran dari text box dalam karakter, default 20
maxlength ="angka", Maksimal banyaknya karakter yang diterima
name ="nama" , Nama dari elemen yang dikirim ke suatu aplikasi
3. Checkbox <input type="checkbox">
Digunakan untuk kita dapat memilih lebih dari satu pilihan. Atributnya :
VALUE ="text", Akan menampilkan isinya sebagai nilai default
NAME ="nama", Nama dari elemen yang dikirim ke suatu aplikasi
CHECKED , Jika Atribut ini di tambahkan maka checkbok akan secara otomatis tercentang
4. Radio Button <input type="radio">
Digunakan untuk kita hanya memilih salah satu dari suatu pilihan. Atributnya :
VALUE ="text", Akan menampilkan isinya sebagai nilai default
NAME ="nama", Nama dari elemen yang dikirim ke suatu aplikasi
5. Push Button <input type="button">
Digunakan sebagai tombol untuk melakukan suatu aksi. Atributnya:
TYPE ="Submit | reset| image", Digunakan untuk menentukan tipe tombol apa yang digunakan.
VALUE = " text", Digunakan untuk memberi label diatas button
NAME = "nama" , Nama dari elemen yang akan dikirim ke suatu aplikasi
SRC="sumber", Nama dari sumber, digunakan untuk sumber dari button yang bertype image
catatan :
Type Submit : untuk mengirim suatu informasi yang telah kita isi ke suatu aplikasi, button standar
Type Reset: untuk me-reset semua yang telah kita isi dalam suatu form.
Type image : untuk merubah suatu button standar menjadi gambar, tetapi tetap button.
6. Text Area<textarea>...</textarea>
Tag yang digunakan untuk menulis secara keinginan, biasa digunakan untuk memberikan area untuk menuliskan suatu komentar. Attributnya :
Digunakan sebagai tombol untuk melakukan suatu aksi. Atributnya:
TYPE ="Submit | reset| image", Digunakan untuk menentukan tipe tombol apa yang digunakan.
VALUE = " text", Digunakan untuk memberi label diatas button
NAME = "nama" , Nama dari elemen yang akan dikirim ke suatu aplikasi
SRC="sumber", Nama dari sumber, digunakan untuk sumber dari button yang bertype image
catatan :
Type Submit : untuk mengirim suatu informasi yang telah kita isi ke suatu aplikasi, button standar
Type Reset: untuk me-reset semua yang telah kita isi dalam suatu form.
Type image : untuk merubah suatu button standar menjadi gambar, tetapi tetap button.
6. Text Area<textarea>...</textarea>
Tag yang digunakan untuk menulis secara keinginan, biasa digunakan untuk memberikan area untuk menuliskan suatu komentar. Attributnya :
ROWS, Mengatur tinggi dari Text area
COLS, Mengatur lebar dari Text area
NAME, Nama dari elemen yang akan dikirim ke suatu aplikasi
7. Select<Select>...</Select>
Digunakan untuk combo box, tetapi akan ada isinya apabila didalam tag <select> diberi tag <option> . Attribut dari tag<select> :
SIZE="angka", Jumlah isi yang dapat terlihat secara langsung
NAME = "nama" , Nama dari elemen yang akan dikirim ke suatu aplikasi
Attribut dari tag <option>:
VALUE ="text", Akan menampilkan isinya sebagai nilai default
NAME = "nama" , Nama dari elemen yang akan dikirim ke suatu aplikasi
SELECTED, jika attribut ini diberi, maka yang akan terlihat langsung option ini.
Contoh :
<html>
<head>
<title>Latihan Form</title>
</head>
<body>
<FORM METHOD="GET" ACTION="mailto:Ebriz.innocent@gmail.com">
<H4>FORM</H4>
<INPUT TYPE="text" NAME="var1" SIZE="30" VALUE="Masukkan Namamu.">
<BR><BR>
<B>Apakah kamu seorang pelajar?</B>
<INPUT TYPE="checkbox" NAME="var2" checked>
<BR><BR>
<B>Berapa umur kamu?</B>
<BR>
<INPUT TYPE="radio" NAME="var3" VALUE="r1" >10 - 15
<BR>
<INPUT TYPE="radio" NAME="var3" VALUE="r2">16 - 20
<BR>
<INPUT TYPE="radio" NAME="var3" VALUE="r3">21 - 25
<BR><BR>
<B>Darimana kamu berasal</B>
<BR>
<SELECT NAME="var6" SIZE="1">
<OPTION VALUE="IND">Indonesia
<OPTION VALUE="UK">Inggris
<OPTION VALUE="USA" SELECTED>USA
</SELECT>
<BR><BR>
<B>Komentarmu :</B>
<BR>
<TEXTAREA NAME="var7" COLS="15" ROWS="10">
</TEXTAREA>
<BR><BR>
<INPUT TYPE="submit" NAME="var4" VALUE="Send">
<INPUT TYPE="image" src="infinity_small_med.png" NAME="var6" VALUE="image">
<INPUT TYPE="reset" NAME="var5" VALUE="Clear">
</FORM>
</body>
</html>
Hasilnya :
Sekian untuk postingan tentang HTML - Form..
Keep Moving and Keep Learning .. :)
NAME = "nama" , Nama dari elemen yang akan dikirim ke suatu aplikasi
SELECTED, jika attribut ini diberi, maka yang akan terlihat langsung option ini.
Contoh :
<html>
<head>
<title>Latihan Form</title>
</head>
<body>
<FORM METHOD="GET" ACTION="mailto:Ebriz.innocent@gmail.com">
<H4>FORM</H4>
<INPUT TYPE="text" NAME="var1" SIZE="30" VALUE="Masukkan Namamu.">
<BR><BR>
<B>Apakah kamu seorang pelajar?</B>
<INPUT TYPE="checkbox" NAME="var2" checked>
<BR><BR>
<B>Berapa umur kamu?</B>
<BR>
<INPUT TYPE="radio" NAME="var3" VALUE="r1" >10 - 15
<BR>
<INPUT TYPE="radio" NAME="var3" VALUE="r2">16 - 20
<BR>
<INPUT TYPE="radio" NAME="var3" VALUE="r3">21 - 25
<BR><BR>
<B>Darimana kamu berasal</B>
<BR>
<SELECT NAME="var6" SIZE="1">
<OPTION VALUE="IND">Indonesia
<OPTION VALUE="UK">Inggris
<OPTION VALUE="USA" SELECTED>USA
</SELECT>
<BR><BR>
<B>Komentarmu :</B>
<BR>
<TEXTAREA NAME="var7" COLS="15" ROWS="10">
</TEXTAREA>
<BR><BR>
<INPUT TYPE="submit" NAME="var4" VALUE="Send">
<INPUT TYPE="image" src="infinity_small_med.png" NAME="var6" VALUE="image">
<INPUT TYPE="reset" NAME="var5" VALUE="Clear">
</FORM>
</body>
</html>
Hasilnya :
 |
| Hasil dari Latihan FORM |
Sekian untuk postingan tentang HTML - Form..
Keep Moving and Keep Learning .. :)
Tidak ada komentar:
Posting Komentar