Membuat Tabel Form Dengan HTML
HTML |
Form
adalah cara untuk mendapatkan umpan balik dari pengunjung ke situs web yang
diawali dan diakhir dengan tag <FORM>
dan </FORM>. Field-field yang
berada diantaranya, digunakan untuk menentukan ukuran dan jenis dari masing-
masing input field. Walaupun dapat dimiliki banyak form dalam satu halaman,
tetapi anda tidak dapat melakukan form dalam form
Elemen-elemen
dalam suatu form
Bagian
berikut menerangkan berbagai elemen yang dapat ditempatkan dalam suatu
form.
form.
- INPUT - Elemen INPUT menentukan informasi dari user interface. Berikut ini adalah atribut untuk INPUT tag.
- CHECKED - Untuk checkboxes dan radio button, atribut ini dapat di set ke TRUE (checked) atau FALSE (unchecked).
- MAXLENGTH - MAXLENGTH menentukan jumlah maximum karakter yang mana dapat dimasukkan dalam suatu textbox.
- NAME - Menentukan nama dari form control. Hal ini digunakan untuk menentukan eleme data pada form ke resource yang memproses elemen ini.
Script HTML untuk membuat Tabel Form
<head><title>INPUT DATA</title></head>
<body>
<form>
<table width="55%" height="60%" border="1" align="center">
<tr align="center">
<td colspan="2"><b>INPUT DATA</td>
</tr>
<tr>
<td>NIM</td>
<td><input type="text" size="20"></td>
</tr>
<tr>
<td>Nama</td>
<td><input type="text" size="30"></td>
</tr>
<tr>
<td>Jenis Kelamin</td>
<td>
<input type="radio" name="pilih" ckecked>Laki-Laki
<input type="radio" name="pilih">Perempuan<br>
</td>
<tr>
<td>Hoby</td>
<td>
<input type="checkbox">Sepak Bola<br>
<input type="checkbox">Membaca<br>
<input type="checkbox">Mengoprasikan Komputer<br>
</td>
</tr>
<tr>
<td>Fakultas</td>
<td>
<select size="1">
<option>Fakultas Ilmu Komputer
<option>Fakultas Keguruan & Pendidikan
<option>Fakultas Kehutanan
<option>Fakultas Ekonomi
<option>Fakultas Hukum
</select>
</td>
</tr>
<tr>
<td>Motto</td>
<td>
<textarea rows="3" cols="25"></textarea>
</td>
</tr>
<tr align="center">
<td colspan="2">
<input type="button" value="Simpan">
<input type="reset" value="Reset">
<input type="button" value="Keluar">
</td>
</tr>
</table>
</form>
</body>
</html>
Hasilnya Seperti Berikut :
Penjelasan :
- Checked - Untuk checkboxes dan radio button, atribut ini dapat di set ke TRUE (checked) atau FALSE (unchecked).
- Type = ”Radio” - Fungsi ini menyerupai checkbox control, tetapi hanya satu option button dari group yang dapat dipilih setiap saat. Pilih Ya atau Tidak. Bentuk dari type radio yaitu Bulat.
- Checkbox adalah kontrol sederhana TRUE/ FALSE, yang mana kalau di check adalah TRUE, dan kosong menyatakan FALSE. Bentuk checkbox ialah KOTAK. Checkbox memiliki atribut :
- Checked : memberi default check
- Name :Nama dari control
- Size :ukuran control
- Type :<input type="checkbox">
- Value :Untuk bemberi value ke input
- ComboBox / List Box (Selection) - Tag <SELECT> digunakan untuk membuat component combo box. sementara untuk item dari combo box menggunakan tag <OPTION>. Selection memiliki atribut :
- Name : Untuk memberi nama element
- Size : Untuk menentukan jumlah baris yang di tampilkan
- Multiple : Menentukan apakah user boleh memilih lebih dari satu option atau Tidak
- TextArea diperlukan dalam pembuatan blog atau website saat membuat text atau tulisan di dalam box. Hasil penulisan text di dalam Textarea tersebut akan ditulis tanpa merubah ukuran dari texarea itu sendiri (sebelumnya char width (cols) dan rows didefinisikan terlebih dahulu). Apabila text yang ditulis melebihi kapasitas ukuran textarea, maka textarea tersebut akan otomatis membuat scrollbar di sebelah kanan. Untuk membuat textarea gunakan tag <textarea>......</textarea>. Text Area memiliki atribut:
- cols : Lebar dari text area
- rows : Jumlah baris
- Name : Nama dari control
- Size : Ukuran control
Semoga Bermanfaat ;)
Hallo kita ada juga nih artikel tentang 'Tabel HTML' silahkan kunjungi dan dibaca. Ini linknya;
ReplyDeletehttp://repository.gunadarma.ac.id/bitstream/123456789/521/1/paper_Darma_59-68.pdfhttp://repository.gunadarma.ac.id/bitstream/123456789/7036/1/0000010372-_Jurnal_STIK_dty_20120710.pdf
Thank you.
Semoga bermanfaat.
Oke Sipzz :D
Deletewah lengkap banget mas jadi mudah belajarnya thx ya
ReplyDeleteThanks infonya gan...
ReplyDeleteBagi agan yang berminat belajar membuat web bisa dilihat di situs beriku ini http://www.computer-course-center.com/web-design.html
gan,
ReplyDeleteitu kan tabel. input.
kalo tabel yg isian tabel input gimana carabuatnya? mohon infonya gan
Bagus gan artikelnya, sangat membantu saya dalam membuat form dengan HTML. Jadi Proses Pembelajaran saya lebih mudah untuk dimengerti. Thanks gan atas ilmunya, semoga dapat membuat karya yang bermanfaat untuk kedepannya. Perkenalkan Nama Saya Lois Pratama, dan kunjungi juga website kampus saya https://www.atmaluhur.ac.id/
ReplyDeleteMembuat Tabel Form Dengan Html - Acortz'08 Technology >>>>> Download Now
ReplyDelete>>>>> Download Full
Membuat Tabel Form Dengan Html - Acortz'08 Technology >>>>> Download LINK
>>>>> Download Now
Membuat Tabel Form Dengan Html - Acortz'08 Technology >>>>> Download Full
>>>>> Download LINK
Membuat Tabel Form Dengan Html - Acortz'08 Technology >>>>> Download Now
ReplyDelete>>>>> Download Full
Membuat Tabel Form Dengan Html - Acortz'08 Technology >>>>> Download LINK
>>>>> Download Now
Membuat Tabel Form Dengan Html - Acortz'08 Technology >>>>> Download Full
>>>>> Download LINK Je