twitter
googleplus
facebook

Membuat Form Pendaftaran menggunakan HTML

Ok sob langsung aja,pada postingan kali ini admin akan mencoba untuk memposting bagaimana cara membuat form pendaftaran menggunakan HTML. Kita ambil studi kasus pembuatan form pendaftaran pembuatan e-KTP. Untuk tampilannya sobat bisa lihat gambar dibawah ini :


Untuk source codenya adalah sebagai berikut :

<html>
<head>
<title>FORMULIR PENDAFTARAN E-KTP</title>
<h1><center>FORM PENDAFTARAN E-KTP</cemter></h1>
</head>
<body>
<form action=" formulir.html" method="get">
<table>
<tr>
<td>No. Pendaftaran</td><td>:</td>
<td><INPUT TYPE="Text" NAME="varNodaftar" SIZE="30"></td>
</tr>
<tr>
<td>Nama</td><td>:</td>
<td><INPUT TYPE="Text" NAME="varNama" SIZE="30"></td>
</tr>
<tr>
<td>Tempat, Tanggal lahir</td><td>:</td>
<ul>
<td>Tempat<INPUT TYPE="Text" NAME="varTempat" SIZE="10"></td>
<td>Tanggal<INPUT TYPE="Text" NAME="varTanggal" SIZE="10"></td>
<td>Bulan<INPUT TYPE="Text" NAME="varBulan" SIZE="10"></td>
<td>Tahun</td>
<td><SELECT NAME="tahun" SIZE="1">
<option>2014</option>
<option>2013</option>
<option>2012</option>
<option>2011</option>
<option>2010</option>
<option>2009</option>
<option>2008</option>
<option>2007</option>
<option>2006</option>
<option>2005</option>
<option>2004</option>
<option>2003</option>
<option>2002</option>
<option>2001</option>
<option>2000</option>
<option>1999</option>
<option>1998</option>
<option>1997</option>
<option>1996</option>
<option>1995</option>
<option>1994</option>
<option>1993</option>
<option>1992</option>
<option>1991</option>
<option>1990</option>
</ul>
</select> </td>
</tr>
<tr>
<td>Pekerjaan</td><td>:</td>
<td><INPUT TYPE="Text" NAME="varPekerjaan" SIZE="30"></td>
</tr>
<tr>
<td>Status Pernikahan</td><td>:</td>
<td>
<INPUT TYPE="Checkbox" NAME="Status" VALUE="Menikah">Menikah
<INPUT TYPE="Checkbox" NAME="Hobi" VALUE="BelumMenikah">Belum Menikah
<INPUT TYPE="Checkbox" NAME="Status" VALUE="Janda">Janda
<INPUT TYPE="Checkbox" NAME="Status" VALUE="Duda">Duda
</td>
</tr>
<tr>
<td>Alamat</td><td>:</td>
<td><textarea Cols="30" Rows="5" Name="Alamat"></textarea></td>
</tr>
<tr>
<td>Agama</td><td>:</td>
<td><SELECT NAME="agama" SIZE="1">
<option>Islam</option>
<option>Kristen</option>
<option>katolik</option>
<option>Budha</option>
<option>Hindu</option>
</select> </td>
</tr>
<tr>
<td>Rt / Rw</td><td>:</td>
<td>Rt<INPUT TYPE="Text" NAME="varRT" SIZE="10"></td>
<td>Rw<INPUT TYPE="Text" NAME="varRW" SIZE="10"></td>
</tr>
<tr>
<td>Kelurahan</td><td>:</td>
<td><INPUT TYPE="Text" NAME="varKelurahan" SIZE="30"></td>
</tr>
<tr>
<td>Kecamatan</td><td>:</td>
<td><INPUT TYPE="Text" NAME="varKecamatan" SIZE="30"></td>
</tr>
<tr>
<td>Kabupaten</td><td>:</td>
<td><INPUT TYPE="Text" NAME="varKabupaten" SIZE="30"></td>
</tr>
<tr>
<td>Provinsi</td><td>:</td>
<td><INPUT TYPE="Text" NAME="varProvinsi" SIZE="30"></td>
</tr>
<tr>
<td>Jenis kelamin</td><td>:</td>
<td><INPUT TYPE="Radio" NAME="Kelamin" VALUE="Pria">Pria</td>
<td><INPUT TYPE="Radio" NAME="Kelamin" VALUE="Wanita">Wanita</td>
</tr>
<tr>
<td>Tanggal Pendaftaran</td><td>:</td>
<ul>
<td>Tanggal<INPUT TYPE="Text" NAME="varTanggal" SIZE="10"></td>
<td>Bulan<INPUT TYPE="Text" NAME="varBulan" SIZE="10"></td>
</ul>
</tr>
</table>
<br>
<br>
<br>
<form method="get" action="POST"title="Daftar"target="_blank"><input name="Button" type="submit" value="Daftar" /><form method="get" action="POST"title="Cancel"target="_blank"><input name="Button" type="submit" value="Cancel" /></form>

</FORM>
</body>
</html>

Karena di blog ini tidak bisa copy paste,silahkan sobat download source codenya di link berikut :


Setelah filenya sobat download,setelah itu buka dengan notepad++ atau gunakan tools text editor lainnya, lalu modifikasi scriptnya sesuai keinginan sobat.
Semoga postingan kali ini bermanfaat untuk kita semua.
Salam Berbagi
  • Title : Membuat Form Pendaftaran menggunakan HTML
  • Labels :
  • Author :
  • Rating: 100% based on 10 ratings. 5 user reviews.
  • 10 komentar:

    Poskan Komentar