Cara Membuat Form Data Siswa pada Website
Oke guys, kembali lagi bersama saya Alvin Harya Putra dengan blog ini yang semoga dapat bermanfaat untuk kalian semua. Kali ini, saya mau membahas bagaimana sih cara membuat form data siswa untuk website. Oh ya, sebelumnya form data berguna untuk mengetahui biodata atau identitas seseorang, biasanya sih untuk persyaratan pendaftaran kerja, pendaftaran media sosial seperti Facebook, atau pendaftaran online sekolah, dan masih banyak lagi. Baiklah, itu saja yang bisa saya sampaikan sebagai bagian pendahuluan pada tema kali ini.
1. Pertama, pastikan kalian mempunyai CodeLobster atau bisa juga Notepad. Tapi, disarankan CodeLobster ya, karena jika salah dalam membuatnya kita bisa langsung tau dimana letak permasalahannya. Biasanya sih, ada tanda seru warna merah. Bagi yang belum punya, silahkan download saja di Download CodeLobster
2. Jika sudah punya, bisa langsung dipraktikan, lihat saja koding di bawah ini.
<html>
<head>
<title>Pembahasan-11</title>
</head>
<u><b><center>FORM DATA
SISWA</u></b></center><br>
<body>
<table border="0" "width="600">
<tr>
<td>NIS</td>
<td><input type="text"
name="text"/></td>
</tr>
<tr>
<td>NAMA</td>
<td><input type="text"
name="text"/></td>
</tr>
<tr>
<td>TEMPAT LAHIR</td>
<td><input type="text"
name="text"/></td>
</tr>
<td>TANGGAL LAHIR</td>
<td><input type="text"
name="text"/>/<input type="text"
name="text"/>/<input type="text"
name="text"/></td>
</tr>
<tr>
<td>KELAS</td>
<td>
<form method="POST" action="#">
<input type="radio" name="jk"/>Sepuluh
<input type="radio" name="jk"/>Sebelas
<input type="radio" name="jk"/>Dua belas
</form>
</td>
<tr>
<td>JURUSAN</td>
<td>
<select name="pilihan">
<option value="pilih1">TKBB</option>
<option value="pilih2">TKR</option>
<option value="pilih3">TAV</option>
<option value="pilih4">TEI</option>
<option value="pilih5">TMK</option>
<option value="pilih6">TPL</option>
<option value="pilih7">TP</option>
<option value="pilih8">TITL</option>
<option value="pilih9">TF</option>
<option value="pilih10">TKJ</option>
</select>
</td>
</tr>
<tr>
<td>HOBBY</td>
<td>
<input type="checkbox">Tidur</input>
<input type="checkbox">Olahraga</input>
<input type="checkbox">Berenang</input>
</td>
</tr>
<tr>
<td>No.TELP</td>
<td><input type="text"
name="text"/></td>
</tr>
<tr>
<td>ALAMAT</td>
<td>
<TextArea name="textarea" cols="35"
rows="5"></textarea>
</td>
</tr>
<tr>
<td></td>
<td>
<input type="button" name="button"
value="Simpan" />
<input type="reset" name="reset"
value="Reset" />
</td>
</table>
</body>
</html>
Pada materi ini, kita tidak perlu memakai style.css nya.
Disitu, saya memberi judul Form Data Siswa, karena tujuan saya membuat form data pendaftaran lomba untuk siswa.
Pada kelas, disini saya beri input type-nya radio berguna untuk memilih salah satu pada pilihan tertentu. Sedangkan pada hobby saya memakai checkbox karena hobby bisa lebih dari satu dan tidak bisa dipaksakan. Pada Alamat saya memakai textarea untuk mengatur seberapa luas kolom alamat yang ingin dibuat. Karena alamat membutuhkan luas kolom yang lebih besar dari lainnya.
3. Silahkan jalankan koding, jangan lupa di Save-As dengan nama file keinginan kalian dan ada .html pada belakang file yang kalian namakan. Klik 2 kali pada file yang bersimbol browser untuk menjalankannya.
4. Jika berhasil, maka akan muncul seperti ini..
5. Selamat Mencoba! Sampai bertemu pada artikel selanjutnya...
0 komentar:
Posting Komentar