160 likes | 259 Views
Penggunaan format table di HTML Koleksi input dalam Form beserta fields komponennya (Submit & Reset Buttons, Text Input, Radio Buttons, Check Boxes, Text Areas, Selections fields, dan Hidden Fields) Penggunaan Methoda POST dan GET dalam Form HTML dan URL. 3 . Pendalaman HTML.
E N D
Penggunaan format table di HTML Koleksi input dalam Form beserta fields komponennya (Submit & Reset Buttons, Text Input, Radio Buttons, Check Boxes, Text Areas, Selections fields, dan Hidden Fields) Penggunaan Methoda POST dan GET dalam Form HTML dan URL 3.Pendalaman HTML
Format Table di HTML Table tag : • <TABLE></TABLE> : tag table • <TR></TR> : baris • <TD></TD> : cell • <TH></TH> : table header • <CAPTION> : judul table Atribut : • Width : Lebar ukuran table • Height : Tinggi ukuran table • Cellspacing : jarak antar cell • Cellpading : jarak isi cell ke batas cell • Border : ukuran tebal garis cell • Align : rata letak text secara horizontal • VAlign : rata letak text secara vertical • Rowspan : grouping cell sebaris • Colspan : grouping cell sekolom
Format Table di HTML Satuan Width: Sample : <table width=“100%” height=“100pt” cellspacing=“2” border=“0”> <tr> <td>Cell A1</td><td>Cell B1</td><td>Cell C1</td> </tr> <tr> <td>Cell A2</td><td>Cell B2</td><td>Cell C2</td> </tr> </table>
Form Sebagai media untuk koleksi lenbar form (inputan bagi user) dalam HTML <FORM [METHOD=”[POST|GET]”ACTION=”URL”]> … … </FORM> • ACTION : URL yg dituju yg akan menerima informasi form • METHOD : bagaimana informasi dikirim ke script, POST : informasi form dikirim secara tersendiri dari URL (dlm body protocol HTTP). GET: informasi form dikirim dengan diletakkan di akhir URL. Sample : <form name=“myForm” action=“test.php” method=“GET”> Ini text dalam form </form>
Field Input dlm Form • TEXTAREA <Textarea> … </Textarea> • SELECT <Select> <option> .. </option> </Select> • INPUT : <input type=‘…’ > • Text • Password • Checkbox • Radio • Hidden • Reset • Submit • button
TEXTAREA NAME : nama textarea ROWS : jml baris yg terlihat COLS : lebar kolom dalam karakter Default text untuk text area diletakkan diantara <TEXTAREA> default </ TEXTAREA> Sample : <TEXTAREA NAME="ket" ROWS=4 COLS=40>Default text</TEXTAREA>
SELECT NAME : nama SIZE : jml pilihan MULTIPLE : pilihan bisa lebih dari satu Tag Option : • value • Selected Sample: <SELECT NAME="pilihan1"> <OPTION SELECTED VALUE="AK"> Akuntasi </OPTION> <OPTION VALUE="MG"> Management </OPTION> <OPTION VALUE="EK"> Ekonomi </OPTION> </SELECT> <SELECT MULTIPLE NAME="pilihan2"> <OPTION SELECTED VALUE="UI"> Universitas Indonesia </OPTION> <OPTION VALUE="UGM"> Universitas Gajah Mada </OPTION> <OPTION VALUE="UNPAD"> Universitas Pajajaran </OPTION> </SELECT>
INPUT NAME : nama input SIZE : ukuran panjang text MAXLENGTH : maksimal karakter yg bisa dimasukkan VALUE : isi default CHECKED : default check TYPE : text, password, checkbox, radio, hidden, reset, submit, button Sample : <INPUT TYPE="text" NAME="siswa" SIZE="15" MAXLENGTH="12"> <INPUT TYPE="password" NAME="pwd" Size="30" MAXLENGTH="30"> <INPUT TYPE="checkbox" NAME="lulus" VALUE="YA">Apakah Lulus?. <INPUT TYPE="radio" NAME="pilih" VALUE="choice1"> Hitam <INPUT TYPE="radio" NAME="pilih" VALUE="choice2"> Putih <INPUT TYPE="radio" NAME="pilih" VALUE="choice1"> Biru <INPUT TYPE="hidden" Name VALUE="sembunyi"> <INPUT TYPE="button" VALUE="Klik disini"> <INPUT TYPE="reset" VALUE="Reset Form"> <INPUT TYPE="submit" VALUE="Submit Form">
KOMBINASI FORM DAN TABLE Untuk meletakkan dan format tampilan yg bagus dan sesuai, maka Form dan table HTML bisa saling dikombinasikan Sample : <FORM METHOD="POST" ACTION="contoh.htm"> <TABLE> <TR> <TD>Nama :</TD><TD><INPUT TYPE="Text" NAME="varNama" VALUE="Andy Kurniawan" SIZE="15"></TD> </TR> <TR> <TD>Alamat :</TD><TD><INPUT TYPE="Text" NAME="varAlamat" SIZE="30"></TD> </TR> <TR> <TD>Password :</TD><TD><INPUT TYPE="Password" NAME="varPassword" SIZE="10"></TD> </TR> </TABLE> Jenis kelamin: <INPUT CHECKED TYPE="Radio" NAME="Kelamin" VALUE="Pria">Pria <INPUT TYPE="Radio" NAME="Kelamin" VALUE="Wanita">Wanita <BR><BR> Hobi:<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 <INPUT TYPE="Submit" VALUE="Send info"> <INPUT TYPE="Reset" VALUE="Clear form"> </FORM>