ELEMENT FORM
Element FORM berfungsi untuk Membuat Form HTML dengan mendefinisikan form interaktif. Element ini mempunyai attribute yaitu action, dan method. Attribute action berisikan aksi terhadap form yang dikirim (URI) dan attribute method berisikan metode form melakukan proses pengiriman(GET/POST).
Sintaks:
<form action="action" method="GET"|"POST">
...........................
</form>
ELEMENT INPUT
Membuat Form Element INPUT, berfungsi untuk mendefinisikan input yang akan dimasukkan pengguna. Element ini mempunyai attribute yaitu name, size, type, value, checked.
Attribute name mendefinisikan nama dari input kontrol form, attribute size mendefinisikan ukuran teks pada input kontrol, type mendefinisikan bentuk-bentuk input kontrol, value mendefinisikan nilai awal/reset/submit, checked mendefinisikan pilihan terpilih pada type radio/checkbox. Element ini tidak mempunyai tag penutup dan harus berada di dalam element FORM.
Sintaks:
<input
name="name"
size="number"
type="text"|"checkbox"|"radio"|"submit"|"reset"
value="value"
checked >
ELEMENT SELECT
Membuat Form HTML ,Element SELECT berfungsi untuk mendefinisikan opsi pilihan pada form kontrol. Element ini mempunyai attribute yaitu name, size, multiple(diizinkan banyak pilihan). Element ini harus berada di dalam element FORM.
Sintaks:
<select
name="name"
size="number"
multiple >
.....................
</select>
ELEMENT OPTION
Membuat Form HTML , Element OPTION mendefinisikan opsi pilihan pada menu SELECT. Element ini mempunyai attribute selected, dan value. Attribute selected opsi terpilih dan attribute value berisikan nilai element OPTION.
Sintaks:
<option
selected
value="number" >
.....................
</option>
ELEMENT TEXTAREA
Membuat Form HTML, Element TEXTAREA berfungsi sebagai input kontrol form untuk memasukkan teks lebih dari satu baris. Element ini mempunyai attribute yaitu name, cols, rows. Attribute name mendefinisikan nama input kontrol form element textarea, attribute cols mendefinisikan jumlah kolom textarea yang terlihat, dan attribute rows mendefinisikan jumlah baris textarea yang terlihat. Element ini harus berada di dalam element FORM
Sintaks:
<textarea
name="name"
cols="number"
rows="number" >
.....................
</textarea>
Berikut Contoh Form yang saya buat
ini Scriptnya untuk membuat form silakan copy dan simpan sebagai file HTML kemudian buka di browser
:
<table width="400" border="1" cellpadding="0" cellspacing="2"
bordercolor="#666666">
<tr>
<td width="100" bgcolor="#D6D6D6">Nama</td>
<td bgcolor="#D6D6D6"><input type="text" name="textfield"></td>
</tr>
<tr>
<td bgcolor="#D6D6D6">Alamat</td>
<td bgcolor="#D6D6D6"><textarea name="textarea"></textarea></td>
</tr>
<tr>
<td bgcolor="#D6D6D6">Tempat</td>
<td bgcolor="#D6D6D6"><input type="text" name="textfield2"></td>
</tr>
<tr>
<td bgcolor="#D6D6D6">Tanggal Lahir </td>
<td bgcolor="#D6D6D6"><select name="select">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18<.option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
</select>
<select name="select2">
<option value="1">Januari</option>
<option value="2">Februari</option>
<option value="3">Maret</option>
<option value="4">April</option>
<option value="5">Mei</option>
<option value="6">Juni</option>
<option value="7">Juli</option>
<option value="8">Agustus</option>
<option value="9">September</option>
<option value="10">Oktober</option>
<option value="11">Nopember</option>
<option value="12">Desember</option>
</select>
<select name="select3">
<option value="2001">2001</option>
<option value="2002">2002</option>
<option value="2003">2003</option>
<option value="2004">2004</option>
<option value="2005">2005</option>
<option value="2006">2006</option>
<option value="2007">2007</option>
<option value="2008">2008</option>
<option value="2009">2009</option>
</select></td>
</tr>
<tr>
<td bgcolor="#D6D6D6">Jenis Kelamin </td>
<td bgcolor="#D6D6D6"><input name="radiobutton" type="radio" value="radiobutton">
Pria
<input name="radiobutton" type="radio" value="radiobutton">
Wanita</td>
</tr>
<tr>
<td bgcolor="#D6D6D6">Hobi</td>
<td bgcolor="#D6D6D6"><input type="checkbox" name="checkbox" value="checkbox">
Olah raga </td>
</tr>
<tr>
<td bgcolor="#D6D6D6"> </td>
<td bgcolor="#D6D6D6"><input type="checkbox" name="checkbox2" value="checkbox">
Baca Buku </td>
</tr>
<tr>
<td bgcolor="#D6D6D6"> </td>
<td bgcolor="#D6D6D6"><input type="checkbox" name="checkbox3" value="checkbox">
Internetan</td>
</tr>
<tr>
<td bgcolor="#D6D6D6"> </td>
<td bgcolor="#D6D6D6"><input type="submit" name="Submit" value="Submit">
<input name="Reset" type="reset" id="Reset" value="Reset"></td>
</tr>
</table>
Selamat Mencoba
Tidak ada komentar:
Posting Komentar