Waah uda lama banget ya saya tidak menulis artikel di blog ini..
makasi buat kalian yang sering mengunjungi blog ini dan sudah memberikan komentar pada artikel-artikel yang saya tulis :)
Pada artikel ini saya akan berbagi ilmu tentang pembuatan aplikasi Kartu Tanda Penduduk (KTP) berbasis web. aplikasi ini hanya ada dua halaman: halaman pertama untuk menginputkan data warga negara dan hasilnya akan ditampilan pada halaman kedua.
Dibawah ini adalah tampilan input data warga negara.
ya pada halaman ini user diminta untuk menginputkan datanya dan mengupload fotonya. setelah selesai.
klik button CETAK. kemudian data user tersebut akan tercetak seperti gambar berikut ini:
Gimana sih coding nya supaya bisa jadi program seperti itu??
codingnya lumayan panjang tapi mudah dipahami kok :)
untuk tampilan input data warga negara, saya menggunakan html.
simpan file tersebut dengan nama DATA.html. Selanjutnya buat file baru untuk menampilkan hasil cetak KTP tersebut. untuk menampilkan hasilnya disini saya menggunakan PHP. untuk lebih jelasnya silahkan lihat coding nya di bawah ini.
Simpan file diatas dengan nama KTP.php
maaf ya codingnya dalam bentuk image :)
supaya kalian tidak hanya copy paste hehehe....
semoga artikel ini bermanfaat buat kalian. amiin ^.^
makasi buat kalian yang sering mengunjungi blog ini dan sudah memberikan komentar pada artikel-artikel yang saya tulis :)
Pada artikel ini saya akan berbagi ilmu tentang pembuatan aplikasi Kartu Tanda Penduduk (KTP) berbasis web. aplikasi ini hanya ada dua halaman: halaman pertama untuk menginputkan data warga negara dan hasilnya akan ditampilan pada halaman kedua.
Dibawah ini adalah tampilan input data warga negara.
ya pada halaman ini user diminta untuk menginputkan datanya dan mengupload fotonya. setelah selesai.
klik button CETAK. kemudian data user tersebut akan tercetak seperti gambar berikut ini:
Gimana sih coding nya supaya bisa jadi program seperti itu??
codingnya lumayan panjang tapi mudah dipahami kok :)
untuk tampilan input data warga negara, saya menggunakan html.
<html>
<head>
<title>Data Warga Negara RI</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"></head>
<body bgcolor="#333333">
<form action="KTP.php" enctype="multipart/form-data" method="post">
<table width="638" height="960" border="1" align="center">
<tr>
<td height="94" valign="top" bgcolor="#CC6633"><font color="#FFFFFF"><br>
</font>
<blockquote>
<p>
<center>
<font color="#FFFFFF" size="+2">DATA WARGA NEGARA REPUBLIK INDONESIA</font>
</center>
</blockquote></td>
</tr>
<tr>
<td width="669" valign="top" bgcolor="#FFFFFF"><blockquote><p>
<p><font color="red">* Menginputkan data menggunakan huruf capital</Font></p>
<br>
<p> Nik : <input type="text" name="nik"></p>
<p> Nama Lengkap : <input type="text" name="nama" size=40></p>
<p> Tempat/Tanggal Lahir : <input type="text" name="tl" placeholder= Tempat>
<select name="tgl" placeholder= Tl>
<option value="01">01</option>
<option value="02">02</option>
<option value="03">03</option>
<option value="04">04</option>
<option value="05">05</option>
<option value="06">06</option>
<option value="07">07</option>
<option value="08">08</option>
<option value="09">09</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="bln">
<option value="01">01</option>
<option value="02">02</option>
<option value="03">03</option>
<option value="04">04</option>
<option value="05">05</option>
<option value="06">06</option>
<option value="07">07</option>
<option value="08">08</option>
<option value="09">09</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
</select>
<input type="text" name="thn" placeholder=Tahun></p>
<p>Jenis Kelamin :
<input type="radio" name="sex" value="LAKI-LAKI">LAKI-LAKI
<input type="radio" name="sex" value="PEREMPUAN">PEREMPUAN</p>
<p>Golongan Darah :
<select name="darah">
<option value="A">A</option>
<option value="B">B</option>
<option value="AB">AB</option>
<option value="O">O</option>
</select>
</p>
<p> Alamat :
<input type="text" name="alamat" size=60>
</p>
<p>RT :
<select name="rt">
<option value="01">01</option>
<option value="02">02</option>
<option value="03">03</option>
<option value="04">04</option>
<option value="05">05</option>
<option value="06">06</option>
<option value="07">07</option>
<option value="08">08</option>
<option value="09">09</option>
<option value="10">10</option>
</select></p>
<p>RW :
<select name="rw">
<option value="01">01</option>
<option value="02">02</option>
<option value="03">03</option>
<option value="04">04</option>
<option value="05">05</option>
<option value="06">06</option>
<option value="07">07</option>
<option value="08">08</option>
<option value="09">09</option>
<option value="10">10</option>
</select></p>
<p> Kel/Desa :
<input type="text" name="desa">
</p>
<p> Kecamatan :
<input type="text" name="kecamatan">
</p>
<p> Agama :
<select name="agama">
<option value="ISLAM">ISLAM</option>
<option value="KRISTEN">KRISTEN</option>
<option value="KATOLIK">KATOLIK</option>
<option value="BUDHA">BUDHA</option>
<option value="HINDU">HINDU</option>
</select>
</p>
<p> Status :
<input type="checkbox" name="status" value="BELUM KAWIN">
BELUM KAWIN
<input type="checkbox" name="status" value="MENIKAH">
MENIKAH</p>
<p> Pekerjaan :
<input type="text" name="pekerjaan">
</p>
<p> Kewarganegaraan : <select name="warganegara">
<option value="WNI">WNI</option>
<option value="WNA">WNA</option>
</select>
<p> <input name="MAX_FILE_SIZE" type="hidden" value="3000000" />
File Name : <input name="userfile" type="file" />
</p>
</p>
</blockquote>
<br>
<p> <center><input type="submit" value="CETAK">
<input type="reset" value="BATAL"></center></p>
</td>
</tr>
</table>
</form>
</body>
</html>
<head>
<title>Data Warga Negara RI</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"></head>
<body bgcolor="#333333">
<form action="KTP.php" enctype="multipart/form-data" method="post">
<table width="638" height="960" border="1" align="center">
<tr>
<td height="94" valign="top" bgcolor="#CC6633"><font color="#FFFFFF"><br>
</font>
<blockquote>
<p>
<center>
<font color="#FFFFFF" size="+2">DATA WARGA NEGARA REPUBLIK INDONESIA</font>
</center>
</blockquote></td>
</tr>
<tr>
<td width="669" valign="top" bgcolor="#FFFFFF"><blockquote><p>
<p><font color="red">* Menginputkan data menggunakan huruf capital</Font></p>
<br>
<p> Nik : <input type="text" name="nik"></p>
<p> Nama Lengkap : <input type="text" name="nama" size=40></p>
<p> Tempat/Tanggal Lahir : <input type="text" name="tl" placeholder= Tempat>
<select name="tgl" placeholder= Tl>
<option value="01">01</option>
<option value="02">02</option>
<option value="03">03</option>
<option value="04">04</option>
<option value="05">05</option>
<option value="06">06</option>
<option value="07">07</option>
<option value="08">08</option>
<option value="09">09</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="bln">
<option value="01">01</option>
<option value="02">02</option>
<option value="03">03</option>
<option value="04">04</option>
<option value="05">05</option>
<option value="06">06</option>
<option value="07">07</option>
<option value="08">08</option>
<option value="09">09</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
</select>
<input type="text" name="thn" placeholder=Tahun></p>
<p>Jenis Kelamin :
<input type="radio" name="sex" value="LAKI-LAKI">LAKI-LAKI
<input type="radio" name="sex" value="PEREMPUAN">PEREMPUAN</p>
<p>Golongan Darah :
<select name="darah">
<option value="A">A</option>
<option value="B">B</option>
<option value="AB">AB</option>
<option value="O">O</option>
</select>
</p>
<p> Alamat :
<input type="text" name="alamat" size=60>
</p>
<p>RT :
<select name="rt">
<option value="01">01</option>
<option value="02">02</option>
<option value="03">03</option>
<option value="04">04</option>
<option value="05">05</option>
<option value="06">06</option>
<option value="07">07</option>
<option value="08">08</option>
<option value="09">09</option>
<option value="10">10</option>
</select></p>
<p>RW :
<select name="rw">
<option value="01">01</option>
<option value="02">02</option>
<option value="03">03</option>
<option value="04">04</option>
<option value="05">05</option>
<option value="06">06</option>
<option value="07">07</option>
<option value="08">08</option>
<option value="09">09</option>
<option value="10">10</option>
</select></p>
<p> Kel/Desa :
<input type="text" name="desa">
</p>
<p> Kecamatan :
<input type="text" name="kecamatan">
</p>
<p> Agama :
<select name="agama">
<option value="ISLAM">ISLAM</option>
<option value="KRISTEN">KRISTEN</option>
<option value="KATOLIK">KATOLIK</option>
<option value="BUDHA">BUDHA</option>
<option value="HINDU">HINDU</option>
</select>
</p>
<p> Status :
<input type="checkbox" name="status" value="BELUM KAWIN">
BELUM KAWIN
<input type="checkbox" name="status" value="MENIKAH">
MENIKAH</p>
<p> Pekerjaan :
<input type="text" name="pekerjaan">
</p>
<p> Kewarganegaraan : <select name="warganegara">
<option value="WNI">WNI</option>
<option value="WNA">WNA</option>
</select>
<p> <input name="MAX_FILE_SIZE" type="hidden" value="3000000" />
File Name : <input name="userfile" type="file" />
</p>
</p>
</blockquote>
<br>
<p> <center><input type="submit" value="CETAK">
<input type="reset" value="BATAL"></center></p>
</td>
</tr>
</table>
</form>
</body>
</html>
simpan file tersebut dengan nama DATA.html. Selanjutnya buat file baru untuk menampilkan hasil cetak KTP tersebut. untuk menampilkan hasilnya disini saya menggunakan PHP. untuk lebih jelasnya silahkan lihat coding nya di bawah ini.
maaf ya codingnya dalam bentuk image :)
supaya kalian tidak hanya copy paste hehehe....
semoga artikel ini bermanfaat buat kalian. amiin ^.^
Kereeeeen Melly postingannya. Menarik dan bermanfaat. Sukses selalu ya. Btw I'm following both your blog and g+ account hehe :)
ReplyDeletethank you ririt :)
ReplyDeleteough Anak Unisbank Yach, hihi...
ReplyDeleteGmn si gbs nih
ReplyDeletegak bisanya dimana?
Deleteka, kok kecamatanya nggak muncul ya trus gambarnya juga?
ReplyDeletemungkin ada kesalahan pengetikan kak.
Deletecoba di cek lagi :)