BAB I PENDAHULUAN
2.6 Pengenalan HTML
2.6.5. Tabel
Tag-tag yang biasa digunakan dalam pembuatan tabel antara lain:
<table>…</table> Untuk membuat tabel. Mempunyai atribut-atribut:
Border : untuk mengatur bingkai tabel, besarnya antara 0..10
Bgcolor : untuk memberi warnw background. Width : untuk mengatur lebar tabel
<caption>…</caption> Untuk membuat judul tabel (tidak harus digunakan)
<th>…</th> Untuk membuat judul kolom
<tr>…</tr> Untuk membuat baris dalam kolom
<td>…</td> Untuk membuat satu sel data. Mempunyai
atribut-atribut:
Rowspan : untuk menggabungkan baris. Colspan : untuk menggabungkan kolom.
2.6.6 Form
Halaman web yang interaktif biasanya disertai dengan formulir. Hal ini dimaksudkan agar ada interaksi antara user dan pemilik web. Biasanya, formulir digunakan untuk keperluan registrasi atau pendaftaran. user atau client dapat mengisi formulir yang disediakan dan kemudian mengirimkannya ke server.
Bentuk dasar form adalah sebagai berikut: <HTML>
<HEAD>
<TITLE>Tag list</TITLE> </HEAD>
<BODY>
<form method =”post/get” action=”url tujuan”> </form>
</BODY> </HTML>
Pada bagian method diatas, terdapat dua kemungkinan yaitu post atau get. Post membuat informasi yang dikirim menjadi satu dengan url. Sedangkan get membuat informasi yang dikirim menjadi satu dengan url. Untuk data yang besar dan bersifat confidential seperti password dan sebaainya, sebaiknya data dikirim dengan menggunakan post.
Pada bagian action akan menunjukkan link ke suatu halaman bila tombol submit ditekan.
Jenis-jenis input yang sering digunakan dalam form antara lain adalah:
1. input type text
<input type=”text” name=”nama” size”25” maxlenght=”8”>
2. input type password
Bentuk penulisan:
<input type=”password” name=”passwd” size”8” maxlenght=”8”> Contoh: form1.html
<HTML>
<HEAD><TITLE>form</TITLE> </HEAD>
<form method=”post/get” action=”url tujuan”> <pre>
Nama : <input type=”text” name=”nama” size”25”
maxlenght=”40”><br>
Password : <input type=”password” name=”passwd” size”8” maxlenght=”8”>
</pre> </form> </HTML>
Hasil:
3. checkbox
Digunakan untuk melakukan pilihan berdasarkan beberapa opsi yang disediakan. Opsi yang dipilih boleh lebih dari satu.
Bentuk penulisan:
<input type=”checkbox” name=”teknik” checked>Teknik<br> <input type=”checkbox” name=”ekonomi”>ekonomi<br> <input type=”checkbox” name=”kedokteran”>Kedokteran<br> <input type=”checkbox” name=”komputer”>Komputer
4. radio button
Digunakan untuk melakukan pilihan berdasarkan beberapa opsi. Namun opsi yang dapat dipilih hnya satu.
Bentuk penulisan:
<input type=”radio” name=”sex” checked value=”pria”>Pria<br> <input type=” radio” name=” sex” value=”wanita”>Wanita<br>
Contoh: form2.html <HTML>
<HEAD><TITLE>form</TITLE> </HEAD>
<form method=”post/get” action=”url tujuan”> <pre>
Nama : <input type=”text” name=”nama” size”25”
maxlenght=”40”><br>
Password : <input type=”password” name=”passwd” size”8” maxlenght=”8”>
<input type=”checkbox” name=”teknik” checked>Teknik <input type=”checkbox” name=”ekonomi”>ekonomi <input type=”checkbox” name=”kedokteran”>Kedokteran <input type=”checkbox” name=”komputer”>Komputer <hr>
<input type=”radio” name=”sex” checked value=”pria”>Pria <input type=” radio” name=” sex” value=”wanita”>Wanita </pre>
</form> </HTML>
Hasil:
5. Textarea
Biasanya digunakan untuk mengisi keterangan atau komentar yang panjang.
Bentuk penulisan:
<textarea name=”komentar” row=”5” cols=”40” wrap></textarea> Contoh: form3.html <HTML> <HEAD> <TITLE>Form</TITLE> </HEAD> <BODY> <form method=”post/get”> Komentar:<br>
<textarea name=”komentar” row=”5” cols=”40”
wrap></textarea> </form></BODY> </HTML>
Hasil
6. Select
Digunakan untuk membuat pilihan beupa combo box drop down. Bentuk penulisan:
<select name=”jabatan”>
<option value=”direktur”>Direktur</option> <option value=”manager”>Manager</option> <option value=”karyawan”>Karyawan</option> <option value=”other”>Other</option> </select> Contoh: form4.html <HTML> <HEAD> <TITLE>Form</TITLE> </HEAD> <BODY> <form method=”post/get”> Jabatan: <select name=”jabatan”> <option value=”direktur”>Direktur</option> <option value=”manager”>Manager</option> <option value=”karyawan”>Karyawan</option> <option value=”other”>Other</option> </select> </form></BODY> </HTML>
Hasil
2.6.7 Jenis-Jenis Tombol
Pada dasarnya terdapat dua jenis tombol yang digunakan, yaitu Submit dan Reset. Tombol-tombol ini merupakan tombol yang sering digunakan (walaupun tidak harus dua tombol tersebut)
1. Submit
Digunakan untuk melakukan aksi ke suatu halaman yang dituju oleh atribut “action=…” pada form. Oleh karena itu akan terdapat dua file, file pertama atau file asal berisi form dan file yang kedua merupakan file tujuan setelah form di-submit.
Bentuk penulisan:
<input type=”submit” value=”Kirim”>
2. Reset
Digunakan untuk membatalkan pengisian input pada form. Gambar 2.13 Contoh Select
Bentuk penulisan:
<input type=”reset” value=”kosongkan”>
2.7 Pengenalan PHP