Membuat Form Pendaftaran menggunakan HTML - ♦Semangat Berbagi♦

Breaking

♦Semangat Berbagi♦

Berbagi Tak Kan Pernah Rugi

ads

Post Top Ad

loading...

Post Top Ad

Responsive Ads Here

Kamis, 10 April 2014

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

Post Top Ad

loading...