• Tidak ada hasil yang ditemukan

BAB IV IMPLEMENTASI DAN PENGUJIAN

N/A
N/A
Protected

Academic year: 2021

Membagikan "BAB IV IMPLEMENTASI DAN PENGUJIAN"

Copied!
60
0
0

Teks penuh

(1)

108

4.1 Pembuatan Aplikasi

Tahap pembuatan (

assembly

) merupakan tahap dimana seluruh objek

aplikasi dibuat. Pembuatan aplikasi berdasarkan perancangan yang telah

dilakukan pada tahap sebelumnya mengikuti alur dari diagram–diagram yang

telah dibuat serta memasukkan data yang digunakan untuk berbagai tampilan serta

menentukan urutan aplikasinya.

4.2

Tampilan Sistem Aplikasi Data Kependudukan Berbasis Web

Di dalam menjalankan program ini, yang dilakukan pertama kali adalah

membuka

Web Browser

yang bisa digunakan, kemudian ketik nama

host

yang

menjadi

server

pada bagian

address / location

. Bila

host

yang digunakan sama

dengan host yang dipakai saat ini, maka

host

yang diisi dengan

localhost

. Dan

untuk lebih jelas, ketik pada kolom url pada browser

http://localhost/aplikasi-data-kependudukan/ .

Aplikasi data Kependudukan ini berbasis web dengan menggunakan

program PHP(

Program Hypertext Preprocessor

) yang terdiri dari tampilan

berikut ini :

1.

Halaman Login Pengguna

2.

Menu Halaman Aplikasi data Kependudukan pada ketentuan Pengguna

3.

Menu form data penduduk

4.

Menu Keterangan Tanda Penduduk (KTP)

5.

Menu Kartu Keluarga (KK)

6.

Menu Level User Management

7.

Menu Keterangan Laporan Penduduk

(2)

1.

Halaman Login Pengguna

Perancangan layar halaman ini berfungsi sebagai pengatur ketentuan

pengguna untuk mengakses program aplikasi. Pada tampilan pengguna harus

mengisikan “username” dan password agar dapat masuk ke halaman indeks dan

menu utama pada aplikasi yang sesuai ketentuan pengguna. Untuk lebih jelasnya

dapat dilihat pada gambar 4.1 berikut ini.

Gambar 4.1

Halaman Login Pengguna

Didalam skema perancangan pada halaman login pengguna terdapat proses

untuk identifikasi user untuk melakukan serangkaian aktifitas aplikasi pendataan

penduduk dimana terdapat didalamnya proses untuk mencocokkan identitas user

kedalam database. untuk lebih jelasnya lihat potongan program berikut ini.

(3)

Program 1 : cek_login.php

Maksud dari program diatas adalah bentuk interaksi navigasi proses request

variabel pengguna yang terdiri nama, pass. Dimana hasil dari kedua variabel

tersebut akan di kirim dengan metode action script

POST

kedalam database

data-penduduk2. Kemudian maksud dengan menggunakan action

query

adalah untuk

mengeksekusi data login dengan melakukan pencocokkan data dari tabel user

yang diasumsikan dengan pemodelan

array

dalam bentuk

session,

jika variabel

pass dan nama yang diinput sama dengan data didalam database maka sistem

menyatakan proses tersebut berhasil dilakukan dan mengidentifikasikan

penyesuaian tampilan menu pengguna yang didefinisikan dalam

session $ data

[id_jabatan].

Jika data login tersebut tidak berhasil teridentifikasi maka sistem

menyatakan proses yaitu, username dan password yang diinputkan salah.

Setelah proses login dijabarkan ini, mempunyai tujuan untuk membentuk

sebuah interaksi yang tersetruktur dalam melakukan pengerjaan pengguna

aplikasi, selanjutnya proses skema logout aplikasi yang terdiri perintah berikut ini.

<? session_start(); include "../Koneksi/koneksi.php"; if (!empty($nama)|| !empty($_POST['password'])) { $nama = $_POST['username']; $pass = md5($_POST['password']);

$login = mysql_query("SELECT * FROM user WHERE username='$nama'"); $data=mysql_fetch_array($login); if ($pass == $data['password']){ $_SESSION['fullname'] = $data['fullname']; $_SESSION['login_time'] = time(); $_SESSION['id'] = $data['id_jabatan']; $_SESSION['id_user'] = $data['no'];

echo "<script>alert('Password Berhasil')</script>";

echo "<script>self.location.replace('../index.php')</script>"; ?>

(4)

Lanjutan Program 1 : Logout.php

Maksud dari perintah diatas adalah sebuah instruksi informasi untuk

melakukan proses keluar dari aplikasi, dimana didalamnya terdapat aksi script

session

berbentuk

cookie

untuk menyimpan informasi terhadap session id_

jabatan yang dipakai oleh user. Apabila user tersebut menghendaki untuk

melakukkan proses keluar aplikasi, maka sistem akan menjalankan proses

action

command

berasil keluar dan kembali pada form login pengguna.

Di dalam perintah ini juga terdapat mekanisme

setting auto logout

dalam

bentuk session dengan instruksi variabel

$maxNoActivity = 10

yang dapat

didefinisikan jika dalam waktu (10) sepuluh menit user tidak melakukkan aktifitas

didalam aplikasi, maka aplikasi tersebut akan

me-logout

dengan sendirinya. Hal

ini bertujuan untuk mengamankan aplikasi terhadap user yang tidak berwenang

dalam menggunakan aplikasi.

<?

session_start();

setcookie(session_id(), $_COOKIE[session_id()], time()+5, '/'); session_destroy();

echo "<script>alert('Anda Telah Berhasil Keluar')</script>"; echo "<script>self.location.replace('login.php')</script>"; ?>

// set_timer_auto_logout <?

session_start();

$maxNoActivity = 10; // Minute of session duration of no activity

$difference = (time() - $_SESSION['activeTime']); if($difference > $maxNoActivity) { session_destroy(); echo "<script>self.location.replace('../index.php')</script>"; } $_SESSION['activeTime'] = time(); ?>

(5)

2.

Menu Halaman Aplikasi Data Kependudukan Pada Ketentuan

Pengguna

Pada mekanisme perancangan layar ini, merupakan gambar tampilan halaman

menu utama program yang berisikan halaman untuk pengguna dalam melakukan

akses aplikasi. Untuk lebih jelasnya, berikut ini adalah penggalan

script

dan

tampilan hal utama aplikasi pada gambar 4.2

Gambar 4.2

Halaman Utama Aplikasi

Di dalam penjelasan

script

pada menu halaman utama aplikasi terdapat

beberapa macam langkah yang di terapkan berkaitan dari hasil mekanisme pada

form login yang dijabarkan sebelumnya. Dimana langkah pertama setelah user

sukses melakukan proses login, sistem akan memproses dengan penjabaran script

berikut ini.

(6)

Program 2 : Index.php

Maksud dari perintah diatas adalah terdapat sebuah proses untuk memanggil

dan menggunakan

user

id kedalam bentuk

query

yang asumsinya dimana terdapat

sebuah pengeksekusian pada tabel user dari database. Dan untuk mengidentifikasi

menu aplikasi, terdapat skema proses menggunakan

session[„id‟]

dengan asumsi

untuk membedakan menu rancangan yang berlaku sesuai ketentuan pengguna,

jika session itu bernilai 1 maka teridentifikasi sebagai admin operator, jika session

itu bernilai 2 sebagai admin staff, dan jika session itu bernilai 3 maka

teridentifikasi sebagai entry data. Setelah serangkaian pada penjabaran mekanisme

proses telah dijalankan, lalu sistem akan menampilkan Selamat Datang : (Nama

pengguna), Nomor NIP : (Nomor Induk Pegawai), Jabatan : (posisi pekerjaan),

Hak Akses Sebagai : (Level User). Untuk lebih jelasnya lihat pada gambar 4.2.1

dibawah ini.

<!—Untuk Memanggil dan Menggunakan Identity User didalam database-> <?

$idS = $_SESSION['id_user'];

$sql = mysql_query ("Select * From user where no='$idS'",$con); $data = mysql_fetch_array($sql)

?>

<!—Untuk Mengidentifikasi Menu User Menggunakan Session --> <? if ($_SESSION['id'] == 1 || $_SESSION['id'] == 2 || $_SESSION['id'] == 3 || { ?>

<div style="margin-left:20px; color:#CCCC66;"> Selamat Datang : <? echo $data['fullname']; ?> <br />

Nomor NIP : <? echo $data['nip']; ?> <br />

Jabatan : <? echo $data['posisi']; ?> <br />

Hak Akses Sebagai : <? if ($data['id_jabatan'] == 1){ echo "Admin Operator"; }

else if ($data['id_jabatan'] == 2){

echo "Admin Staff"; }else{($data['id_jabatan'] == 3) echo "Entry Data"; } ?><br />

Tanggal : <? echo date("m.d.Y"); echo "<br>"; ?></div>

(7)

Gambar 4.2.1 Identifikasi User Pada Menu Halaman Utama

Langkah selanjutnya adalah langkah menentukan side bar dan dropdown

menu pada halaman utama

index.php

dimana sistem dapat membedakan

fiture

menu antara tiap masing user dalam ketentuan hak akses penggunaan program.

Berikut ini adalah penjabaran

scriptnya

.

Lanjutan Program 2 : Index.php(Side Bar dan Dropdown Bar

Adm.Operator dan Adm. Staff)

Dari hasil penjabaran menggunakan

session,

digunakan untuk merequest

aksi link halaman website yang tersedia pada menu aplikasi dan sesuai pada

ketentuan pengguna. Jadi jika session 1 sistem akan menjalankan aksi request

page dengan ketentuan pengguna sebagai admin operator, dan jika session 2

sistem akan menjalankan aksi request page dengan ketentuan sebagai admin staff.

<!--Side Menu Bar Admin Operator & Admin Staff-->

<? if ($_SESSION['id'] == 1 || $_SESSION['id'] == 2) { ?> <? $page = $_GET['page'];{ ?>

<div style="margin-left:20px;" id="ddsidemenubar"

class="markermenu"><ul><li><a href="index.php">Home</a></li> <li><a href="#" rel="ddsubmenuside3">Menu Aplikasi</a></li> <li><a href="#" rel="ddsubmenuside4" style="border-bottom-width: 1">Print Laporan</a></li>

</ul> </div>

(8)

Untuk dapat membedakan ketentuan apa yang dibedakan antara kedua admin

tersebut, untuk lebih jelasnya lihat pada gambar berikut ini.

Gambar 4.2.2

Tampilan Menu Pada Admin Operator

Gambar 4.2.3

Tampilan Menu Pada Admin Staff

(9)

Langkah selanjutnya yaitu menentukan side bar dan dropdown menu pada

halaman utama

index.php

pada status user entry data. Berikut ini adalah

penjabaran scriptnya.

Lanjutan Program 2 : Index.php (Side Bar dan Drop Down Menu Entry

Data)

Dari hasil penjabaran script diatas, menyimpulkan bahwa tampilan yang

dapat digunakan oleh

entry data user

pada menu bar terdapat menu aplikasi yang

meliputi drop down menunya terdiri dari, input data penduduk, input keterangan

tanda penduduk, input kartu keluarga, input keterangan laporan penduduk dan

melihat data statistic perkembangan penduduk dengan katagori per-setiap bulan.

Untuk mengidentifikasi proses request halaman navigasi yang terkait pada

menu keseluruhan

user

dapat dijabarkan

script

berikut ini

<!--Side Menu Bar User Entry Data-->

<div style="margin-left:20px;" id="ddsidemenubar"

class="markermenu"><ul><li><a href="index.php">Home</a></li> <li><a href="#" rel="ddsubmenuside3">Menu Aplikasi</a></li> </ul>

</div>

<!—Drop down Menu Bar User Entry Data-->

<ul id="ddsubmenuside3" class="ddsubmenustyle blackwhite"> <li><a href="#">Data Penduduk</a>

<ul>

<li><a href="index.php?page=input_header_penduduk"">Input Data Penduduk</a></li>

</ul></li>

<li><a href="index.php?page=input_ktp"">Keterangan Tanda Penduduk</a>

<ul</li>

<li><a href="index.php?page=input_ktp_baru">Input KTP</a></li>

</ul></li>

<li><a href="#">Kartu Keluarga</a> <ul>

<li><a href="index.php?page=input_kk"">Input KK</a></li> </ul></li>

<li><a href="data/laporan/view.php">Keterangan Laporan Penduduk</a><ul> <li><a href="index.php?page=input_keterangan"">Input Laporan Penduduk</a></li></ul></li> <li><a href="index.php?page=cari_data_statistik">Data Statistik</a></li> </ul>

(10)

Lanjutan Program 2 : Index.php (Request Page Frame Aplikasi)

<?php $halaman=(isset($_REQUEST['page']))? $_REQUEST['page'] : "depan"; switch($halaman) { case"depan":Default;include"pertama.php";break; case"kesimpulan":include"data/kartu_keluarga.php";break; case"input_kk_detail":include"data/input_ktp.php";break; case"input_keluarga":include"data/input_keluarga.php";break; case"input_kk":include"data/kk/input_data_kk.php";break; case"input_laporan":include"data/input_laporan.php";break; case"lihat_ktp":include"data/ktp/lihat_ktp.php";break; case"lihat_data_kk":include"data/kk/cari_data_kk.php";break; case"edit_kk":include"data/edit_kk_tpl.php";break; case"input_ktp_baru":include"data/ktp/tpl_input_ktp.php";break; case"edit_ktp":include"data/ktp/cari_data_ktp.php";break; case"edit_ktp_detail":include"data/ktp/edit_ktp_detail.php";break; case"delete_data_ktp":include"data/ktp/delete_data_ktp.php";break; case"input_header_penduduk":include"data/penduduk/tpl_input_penduduk.ph p";break; case"input_data_penduduk":include"data/penduduk/input_penduduk_detail.p hp";break; case"cari_data_penduduk":include"data/penduduk/cari_data_penduduk.php"; break; case"edit_data_penduduk":include"data/penduduk/edit_penduduk_detail.php ";break; case"delete_data_penduduk":include"data/penduduk/delete_penduduk_detail .php";break; case"hasil_cari_data_penduduk":include"data/penduduk/hasil_cari_data_pe nduduk.php";break; case"hasil_cari_ktp":include"data/ktp/hasil_cari_ktp.php";break; case"hasil_cari_kk":include"data/kk/hasil_cari_data_kk.php";break; case"input_keterangan":include"data/laporan/input_keterangan.php";brea; case"edit_keterangan":include"data/laporan/edit_keterangan.php";break; case"hasil_cari_keterangan":include"data/laporan/hasil_cari_data_ketera ngan.php";break; case"cari_data_laporan":include"data/laporan/cari_data_laporan.php";bre ak;case"input_user":include"data/user/tpl_input_user.php";break; case"cari_user":include"data/user/cari_data_user.php";break; case"edit_user":include"data/user/tpl_edit_user.php";break; case"cari_cetak_laporan":include"data/cetak/cari_data_laporan.php"; break; case"cari_data_laporan_bulanan":include"data/laporan/cari_data_laporan1 .php";break; case"cari_cetak_kk":include"data/cetak/cari_data_kk.php";break; case"cari_cetak_ktp":include"data/cetak/cari_data_ktp.php";break; case"cari_cetak_PDF";include"data/laporan/pilihLaporan.php";break; case"hasil_cari_cetak_ktp":include"data/cetak/hasil_cari_ktp.php"; break; case"hasil_cari_cetak_kk":include"data/cetak/hasil_cari_data_kk.php"; break; case"cari_cetak_penduduk":include"data/cetak/cari_data_penduduk.php";br ea;case"hasil_cari_cetak_penduduk":include"data/cetak/hasil_cari_data_p enduduk.php";break; case"paskibra":include"data/berita/paskibra.php";break; case"pramuka":include"data/berita/pramuka.php";break; case"validasi_sosialisasi":include"data/berita/validasi_sosialisasi.php "; break; }

(11)

3.

Menu Form Data Penduduk

Pada mekanisme perancangan layar ini, merupakan gambar tampilan

halaman menu form Data Penduduk, dimana form tersebut berisikan kumpulan

biodata yang ditetapkan pada penerapan formulir registrasi manual dan system

dapat melakukan authentikasi pada kesamaan Nik Penduduk. Untuk lebih

jelasnya, lihat pada gambar dan penjabaran script berikut ini.

Gambar 4.3

Menu Form Input Data Penduduk

Didalam

Form Aplikasi Awal Data Penduduk

, user disuguhkan sebuah form

sebagai langkah awal pengisian biodata penduduk yang terdiri dari kolom

NIK,

Nama, dan Jenis Kelamin.

Adapun setelah melakukan pemasukan data, user juga

akan disuguhkan authentikasi alert pada kolom NIK, agar tidak terjadi kesamaan

pada masing-masing nomor induk kependudukan Berikut ini adalah penjabaran

Scriptnya.

(12)

Program 3 : tpl_input_penduduk.php (Authentikasi Nik)

<SCRIPT type="text/javascript"> <!—JavaScript Action Authentikasi-!> pic1 = new Image(16, 16);

pic1.src = "loader.gif";

var usr = $("#username").val(); if(usr.length >= 16) { $("#status").html('<img src="images/loader.gif" align="absmiddle">&nbsp;Checking availability...'); $.ajax({ type: "POST", url: "check.php", data: "nik="+ usr,

success: function(msg){

$("#status").ajaxComplete(function(event, request, settings){ if(msg == 'OK') { $("#username").removeClass('object_error'); // if necessary $("#username").addClass("object_ok"); $(this).html('&nbsp;<img src="images/tick.gif" align="absmiddle">'); $("#check_data").val("1"); } else { $("#username").removeClass('object_ok'); // if necessary $("#username").addClass("object_error");

$(this).html(msg)('<br><font color="orange">Nik kurang dari <strong>16</strong>digit.</font>'); $("#check_data").val("0"); } }else function checkduplicate() { if($("#check_data").val()=="0") {

alert("Maaf anda Harus Mengisi Data Yang Msh Kosong"); return false; }else { return true; } } });

(13)

Maksud dari penjabaran script di atas adalah, dapat di simpulkan langkah

awal untuk pengisian nik penduduk memiliki batas inputan yaitu (16) enam belas

digit nomor kependudukan. Setelah itu terdapat

script code JQuery

dengan

beberapa parameter

type

: “POST” yang berfungsi sebagai tipe parameter request

data akan dikirimkan ke file server database dengan

url

: “Check.php” dengan

asumsi parameter data akan di kirim untuk diproses dan di check yakni

(usr.length

>= 16)

, yang secara logikanya nik terinput harus sama dengan batas digit kode

nomor kependudukan yang diterapkan dalam aplikasi. sebelum proses parameter

nik telah dinyatakan sukses, maka sistem menjalankan fungsi pengecekkan pesan

script

event yang akan di jabarkan kedalam logika. Jika nik tersebut belum terdata

dan tersimpan didalam database, maka sistem menjalankan aksi dengan simbol

gambar tick.gif untuk menunjukkan bahwa proses nik dapat diinput dan

tersimpan. Jika data nik tersebut ternyata belum lengkap dalam melakukkan

inputan lalu menekan tombol save, maka sistem akan menjalankan pesan fungsi

pesan

script alert

maaf anda harus mengisi data yang masih kosong. Jika nik

ternyata sudah terdata didalam database, maka sistem menjalankan pesan

nik has

been exist

.

Di dalam metode pengidentifikasian nik ini telah disesuaikan berdasarkan

hasil observasi yang dilakukan di kecamatan Cibodas Tangerang, dimana terdapat

dalam gambar berikut ini

Gambar 4.3.1

Identifikasi Kode Nomor Induk Kependudukan (NIK)

36

71

0914

2906

0014

Kode

Identik

Provinsi

Kode

Kab /

Kota

Kode

Identik

Kec & Kel

Kode

Identik

Ket.

Lahir

Kode

Registrasi

Pendataan

(14)

Lanjutan Program 3 : tpl_input_penduduk.php (Aksi Tombol Input)

<script> $("#cari").click(function() { function displayResult() { var r='3671' var x=document.getElementById("nik3").value; var y=document.getElementById("nik4").value; var z=document.getElementById("nik2").value; var family = r.concat(z,x,y);

var changer = document.getElementById('username');

changer.value = family; }

</script> <body>

<div align="center" style="border:1px solid; border-color:#CCCCCC; width:520px;"><div align="center"><br /> <div style="border:1px solid; width:500px;

background:url(images/footer.jpg);"><label><span

class="style3">FORM INPUT Data PENDUDUK</span></label> </div>

<div align="center"><br /> </div>

<div class="style3" style="width:389px; border:2px solid; background:url(images/footer.jpg);">Menu Input Data

Penduduk</div>

<table width="403" border="0"> <tr>

<td width="89">NIK</td> <td width="4">:</td> <td width="222">

<input style="width:200px;" type="hidden" name="nik" maxlength="16" id="username" />

<input style="width:30px;" type="text" name="nik1" value="3671" readonly="yes" maxlength="4" id="nik1" />

<select name="nik2" onchange="displayResult()" id="nik2"> <option value="0914">0914</option> <option value="0910">0910</option> <option value="0911">0911</option> <option value="0954">0954</option> </select>

<input type="text" style="width:30px;"

onchange="displayResult()" name="nik3" class="required" maxlength="4" id="nik3" />

<input type="text" style="width:30px;"

onchange="displayResult()" name="nik4" class="required" maxlength="4" id="nik4" />

<input type="button" name="cari" value="cek" id="cari" /></td><td align="left" valign="top" width="70" rowspan="4"><div id="status"></div></td></tr>

<input type="submit" name="save" value="Save" onclick="return checkduplicate()" / ><input type="button" value="Cancel" name="cancel"/>

(15)

Lanjutan Program 3 : check.php (untuk pengecekan Nik di database)

Setelah

User

melakukan serangkaian proses pada menu input penduduk

secara mendetail, maka sistem akan memproses data tersebut kedalam database

yang telah dibuat, untuk lebih jelas lihat potongan

listing program

berikut ini.

Lanjutan Program 3 : save_penduduk_detail (menyimpan data penduduk ke

dalam database)

<?php

include "../../Koneksi/koneksi.php";

$query = "SELECT nik FROM penduduk_detail"; $result = mysql_query($query); while($row = mysql_fetch_array($result)){ $languages_list[]=$row[nik]; }?> <? session_start(); if ($_SESSION['id'] == "1" || $_SESSION['id'] == "3") { ?> <? $nik=$_POST['nik']; ['nik4']; include "../../Koneksi/koneksi.php"; echo $simpan="insert into penduduk_detail

(nik,nama,jekel,kewarganegaraan,tmpt_lhr,tgl_lhr,agama,pendidikan,peke rjaan,tgl_berlaku,goldar,status,hub,ayah,ibu,alamat,kodepos,rt_rw,kelu rahan,kecamatan,no_paspor,kitas,tgl_akhir_paspor,no_akta,no_buku_nikah ,tgl_nikah,no_surat_cerai,tgl_cerai,created_at,created_by) values('$nik','$nama','$jekel','$kwn','$tmpt_lhr','$tgl_lhr','$agama', '$pendidikan','$pkrj','$berlaku','$goldar','$status','$hub','$ayah','$ ibu','$alamat','$kode','$rt_rw','$kelurahan','$kecamatan','$no_pas','$ kitas','$tgl_akhr_pas','$no_akta_lahir','$no_akta_nikah','$tgl_nikah', '$no_akta_cerai','$tgl_cerai','$today','".$_SESSION['id_user']."')"; if($exc=mysql_query($simpan,$con)) {

echo "<script>alert('Data Telah Berhasil Disimpan'); self.location.replace('../../index.php'); </script>";}else

{

echo " TERDAPAT KESALAHAN DALAM PENGINPUTAN DATA "; }

?>echo "<script>alert('Anda Tidak Memiliki Hak Akses')</script>"; echo "<script>self.location.replace('../../index.php')</script>";} ?><? } else {?>

(16)

Lanjutan Program 3 : Koneksi.php (Perintah Untuk Mengkoneksi Database)

Perintah diatas adalah proses untuk menyimpan data penduduk ke dalam

database menggunakan

session

, dimana didalamnya terdapat proses pendeteksian

variabel terdiri dari jumlah

field

biodata penduduk dan variabel nama penginput

pengguna yaitu

id_user

yang dijalankan sebelumnya. Setelah itu sistem juga

memasukan pengkodean proses untuk mengintegrasikan ke sebuah database yang

telah dibuat dengan pengkodean

include "../../Koneksi/koneksi.php";$simpan="insert into penduduk_detail.

Jika apabila proses itu dapat dilakukan, maka sistem akan melakukan

action

command

script

“data telah berhasil disimpan” dan kembali ke menu halaman

utama. Dan jika proses itu tidak sempurna, maka sistem akan melakukan

action

script

“terdapat kesalahan dalam penginputan data” dan kembali ke menu input

data penduduk.

Setelah proses penginputan penduduk secara menyeluruh telah dilakukan,

sistem akan kembali pada menu halaman utama pada

index.php .

Kemudian

apabila

user

yang telah terindifikasi pada sistem aplikasi sebagai

admin operator

,

dapat melakukan serangkaian proses memvalidasi ulang data penduduk yang

tersimpan jika terjadi kesalahan dalam melakukan pengisian biodata penduduk

oleh

user

yang teridentifikasi sebagai

Entry Data,

dan pada

user

admin staff

hanya dapat melihat hasil data detail

view

layout detailnya saja. Untuk lebih

lengkapnya tertera pada

listing program

berikut ini.

<?php

$con=mysql_connect("localhost","root",""); mysql_connect ("localhost", "root", ""); mysql_select_db("data-penduduk");

(17)
(18)

<?

include "Koneksi/koneksi.php"; $no_nik=$_POST['no_nik'];

$exc = mysql_query ("Select * From penduduk_detail where nik='$no_nik'",$con);

?> <body>

<table width="520" border="0" align="left" cellspacing="0" cellpadding="0"> <tr> <td width="88"></td> <td width="17" height="5">&nbsp;</td> <td width="344">&nbsp;</td> <td width="71">&nbsp;</td> </tr> <tr> <td colspan="4"><div align="center">

<table width="98%" border="1" align="left" cellpadding="0" cellspacing="0">

<tr bgcolor="#999999">

<td width="10%" > <div align="center" class="style72 style5"><strong>NIK</strong></div></td>

<td width="16%" ><div align="center" class="style72 style5"> <strong>N a m a</strong></div></td>

<td width="17%" ><div align="center" class="style72 style5"><strong>Jenis Kelamin </strong></div></td> <td width="16%" ><div align="center" class="style72 style5"><strong>Tempat Lahir </strong></div></td> <td width="15%" ><div align="center" class="style72 style5"><strong>Tanggal Lahir </strong></div></td> <td width="9%" ><span class="style5"></span></td> <td width="9%" ><span class="style5"></span></td> <td width="8%" >&nbsp;</td>

</tr> <?

while ($tampil = mysql_fetch_assoc($exc)) { ?>

(19)

<tr>

<td bgcolor="#FFFFCC" ><center>

<div align="center" class="style42"> <? echo $tampil['nik']; ?></div></td>

<td bgcolor="#FFFFCC" ><div align="center" class="style42"> <? echo $tampil['nama']; ?></div></td>

<td bgcolor="#FFFFCC" ><div align="center" class="style42"> <? echo $tampil['jekel']; ?></div></td>

<td bgcolor="#FFFFCC" ><div align="center"><span class="style42"> <? echo $tampil['tmpt_lhr']; ?></span></div></td>

<td bgcolor="#FFFFCC" ><div align="center"><span class="style42"> <? echo $tampil['tgl_lhr']; ?></span></div></td>

<td bgcolor="#FFFFCC" class="style21" ><div align="center" class="style33"><a href="index.php?page=edit_data_penduduk&&nik= <?=$tampil['nik'];?>">Edit</a></div></td>

<td bgcolor="#FFFFCC" class="style21" ><div align="center"

class="style33"><a href="index.php?page=delete_data_penduduk&&nik= <?=$tampil['nik'];?>">

Delete</a></div></td>

<td bgcolor="#FFFFCC" class="style21" ><div align="center" class="style33"><a href="data/penduduk/view_data_penduduk.php?nik=<?=$tampil['nik'];?>"> Detail</a></div></td> </tr> <? } ?>

Lanjutan Program 3 : hasil_cari_data_penduduk

(20)

Gambar 4.3.4

Tampilan Cari Data Penduduk Untuk Admin Staff

Jika seorang

user

(admin operator),

melakukan aksi edit pada link navigasi

pilihan untuk mengeksekusi data. Maka sistem akan menyuguhkan

form

edit data

penduduk. Berikut penjabaran

listing program

yang tercantum dan gambar

dibawah ini.

(21)

Lanjutan Program 3 : edit_penduduk_detail (Proses Pengeksekusian

database Yang ingin di proses)

Perintah diatas adalah menunjukan proses dimana sistem melakukan

pengeksekusian memanggil database

data-penduduk

untuk mengeksekusi pada

sebuah

table

didalamnya yang meliputi

table penduduk_detail

dan

table user

,

yang bertujuan untuk menunjukkan keterangan pada

user,

pada tanggal berapa

data penduduk itu dibuat dan oleh nama

user

siapa data itu dibuat sebelumnya.

Dan apabila proses

update

data telah dilakukan maka sistem juga menunjukkan

keterangan pada

user

, pada tanggal berapa data itu di

update,

dan siapa nama

user

meng-update

data tersebut. Lihat hasil tampilan pada gambar berikut ini.

<div align="center">

<? $exc1 = mysql_query ("SELECT

`user`.fullname, penduduk_detail.created_at FROM

penduduk_detail INNER JOIN `user` ON penduduk_detail.created_by = `user`.`no` WHERE

penduduk_detail.nik = '$nik'",$con); $data = mysql_fetch_assoc($exc1);

$Sql = mysql_query ("SELECT `user`.fullname,

penduduk_detail.updated_at FROM penduduk_detail INNER JOIN `user` ON penduduk_detail.updated_by = `user`.`no` WHERE penduduk_detail.nik = '$nik'",$con);

$strSql = mysql_fetch_assoc($Sql); ?> <p align="left" style="margin-left:10px;

color:#CCCC66;">DiBuat Oleh : <? echo $data['fullname']; ?> <br /> Pada Tanggal : <? echo $data['created_at']; ?> <br />

<br />

<? if(!empty($strSql['fullname']) || !empty($strSql['updated_at']))

{?> Diupdate Oleh: <? echo $strSql['fullname']; ?>

<br />Pada Tanggal : <? echo $strSql['updated_at']; ?><? } ?> </p>

</div>

<div style=" width:500px; border:1px solid; border-color:#CCCCCC;"><br />

<br />

<div class="style3" style="width:350px; border:2px solid;

background:url(images/footer.jpg);">Menu Edit Data Penduduk</div> <br />

<table width="369" border="0"><? include "Koneksi/koneksi.php";

$exc = mysql_query ("Select * from penduduk_detail where nik='$nik'",$con);

(22)

Gambar 4.3.5

Tampilan Keterangan User Pada Form Edit Penduduk

(23)

Setelah melakukan proses pengeksekusian untuk keterangan user pada saat

melakukan edit data penduduk, selanjutnya sistem akan menampilkan form edit

data penduduk secara detail,yang pada dasarnya hampir sama pada tampilan menu

penduduk detail sebelumnya yang diterangkan pada langkah pemasukan data

penduduk, hanya perbedaannya pada pengkodean untuk menyimpan data yang

telah di update kedalam database. Berikut listing program yang tercantum

dibawah ini.

Lanjutan Program 3 : update_penduduk_detail (menyimpan data update

Penduduk)

Apabila user

(admin operator)

ingin mendelete isi data kependudukan yang

telah diinput sebelumnya, berikut

listing program

yang tercantum berikut ini.

<? session_start(); if ($_SESSION['id'] == "1") { ?> <? include "../../Koneksi/koneksi.php"; mysql_select_db("data-penduduk");

$simpan = mysql_query("Update penduduk_detail set

nama='$nama',jekel='$jekel',kewarganegaraan='$kngr',tmpt_lhr='$tmpt_lh r',tgl_lhr='$tgl_lhr',agama='$agama',pekerjaan='$pkrj',pendidikan= '$pendidikan',status='$status',alamat='$alamat',rt_rw='$rt_rw', kelurahan='$kelurahan',hub='$hub',ayah='$ayah',ibu='$ibu',kecamatan= '$kecamatan',no_paspor='$no_pas',tgl_akhir_paspor='$tgl_akhr_pas', no_akta='$no_akta_lahir',no_buku_nikah='$no_akta_nikah',tgl_nikah= '$tgl_nikah',no_surat_cerai='$no_akta_cerai',tgl_cerai ='$tgl_cerai',updated_at='$today',updated_by='".$_SESSION['id_user']." ' where nik='$nik'",$con); if($simpan) {

echo "<script>alert('Data Telah Berhasil Disimpan');

self.location.replace('../../index.php?page=cari_data_penduduk' );

</script>";} else {

echo " TERDAPAT KESALAHAN DALAM PENGINPUTAN DATA "; }

(24)

Lanjutan Program 3 : delete_penduduk_detail

Gambar 4.3.7

Tampilan View Detail Data Penduduk

<?

include "Koneksi/koneksi.php"; $nik=$HTTP_GET_VARS['nik'];

$exc = mysql_query("delete from penduduk_detail where nik='$nik'",$con);

$exc1 = mysql_query("delete from penduduk_header where nik='$nik'",$con);

if ($exc&&$exc1) {

echo "Data telah terhapus <a href=cari_keluarga.php> Lihat Data Kartu Keluarga </a>";

} else{

echo "gagal"; }?>

(25)

4.

Menu Keterangan Tanda Penduduk (KTP)

Pada perancangan layar ini, merupakan gambar tampilan pada form untuk

meregistrasi keterangan penduduk dalam melakukan pembuatan KTP. Dimana

proses didalamnya terdapat beberapa

field

biodata penduduk yang telah digunakan

dalam proses menu input data penduduk, dan pada form ini sistem juga

menerapkan sistem authentikasi pada no ktp, yang berguna untuk mencegah data

ganda pada identitas no ktp. Untuk lebih jelasnya, lihat pada gambar dan

penjabaran

script

berikut ini.

(26)

Program 4 : tpl_input_ktp.php

<html> <head>

<style type="text/css"> <!--

.style3 {color: #FFFFFF; font-weight: bold; } -->

</style> </head> <body>

<div align="center" style="border:1px solid; border-color:#CCCCCC; width:520px;">

<div align="center"><br />

<div style="border:1px solid; width:500px; background:url(images/footer.jpg);">

<label><span class="style3">FORM KARTU TANDA PENDUDUK</span></label> </div>

<div align="center"><br /> <br />

</div>

<div style=" width:500px; border:1px solid; border-color:#CCCCCC;"><br /><br /><div style="width:450px; border:1px solid;

border-color:#CCCCCC;"><br /><br />

<div class="style3" style="width:318px; border:2px solid; background:url(images/footer.jpg);">Menu Input Header KTP</div> <br />

<input type="hidden" id="check_data2" /><input type="hidden" id="check_data" /> <form name="form1" method="post"

enctype="multipart/form-data" action="data/ktp/save_data_ktp.php"> <table width="344" border="0">

<tr >

<td width="107" ><span>Nomor KTP</span></td> <td width="10" ><span>:</span></td>

<td width="220" ><span >

<input name="no_ktp" type="text" id="username" maxlength="16" /><div id="status"></div>

</span></td></tr> <tr>

<td>NIK</td> <td>:</td>

<td><select name="nik" id="username1"><? include "Koneksi/koneksi.php";

$exc = mysql_query ("Select nik from penduduk_detail ",$con); while ($tampil = mysql_fetch_assoc($exc)) { echo

"<option>".$tampil['nik']."</option>"; }?>

(27)

Lanjutan Program 4 : tpl_input_ktp.php

<tr>

<td>Berlaku Hingga</td> <td>:</td>

<td><input type="checkbox" name="cbo_berlaku" value="Seumur Hidup" onclick="codename()"/><label >Seumur Hidup</label><input type="text" name="berlaku" id="masa_berlaku"></td>

</tr> <tr>

<td>Foto</td> <td>:</td>

<td><input type="file" name="file" id="file" /></td> </tr>

</table> <br />

<input type="submit" name="save" value="Save" onclick="return

checkduplicate()" /><input type="button" value="Cancel" name="cancel" />

</form>

</div><br /><br /> </div><br /><br />

<p style="text-align: justify;">

<b>Kartu Tanda Penduduk</b> adalah identitas resmi

seseorang sebagai penduduk Kecamatan Cibodas. Kartu ini wajib dimiliki oleh penduduk yang telah berusia 17 tahun dan atau telah menikah. Pembuatan KTP dilakukan selambat-lambatnya 14 hari sejak :

<ol>

<li style="text-align: justify;"> Berusia 17 tahun</li> <li style="text-align: justify;">

Tanggal Pernikahan</li> <li style="text-align: justify;">

Menjadi Penduduk Wilayah Kecamatan Cibodas</li> <li style="text-align: justify;">

Penggantian KTP dilakukan selambat-lambatnya 14 hari sejak berakhir masa berlakunya KTP.</li></p>

</ol>

<p style="text-align: justify;">

Untuk memperoleh Kartu Tanda Penduduk (KTP) baru harus melengkapi syarat-syarat berikut :</p>

<ol>

<li style="text-align: justify;"> Surat Pengantar dari RT/RW.</li> <li style="text-align: justify;">

Foto Copy Kartu Keluarga.</li> <li style="text-align: justify;">

Pas Foto terbaru berukuran 2 x 3 cm sebanyak 3 lembar.</li>

<li style="text-align: justify;">

SKPPB bagi pendatang baru dari luar Kotamadya Tangerang.</li>

<li style="text-align: justify;"> Foto copy Akta Kelahiran.</li> <li style="text-align: justify;">

SKPPT bagi WNA.</li> </ol>

<p>KTP berlaku untuk jangka waktu 5 tahun, kecuali manula (berusia di atas 60 tahun), KTP berlaku seumur hidup. Berakhirnya masa berlaku KTP, sesuai dengan tanggal dan bulan kelahiran yang bersangkutan. KTP yang rusak, hilang atau berubah data, harus diganti dengan KTP baru. </p>

</body> </html>

(28)

<?include"Koneksi/koneksi.php";$exc=mysql_query (“select nik from

penduduk_detail”,$con);while ($tampil = mysql_fetch_assoc($exc))

{ echo "<option>".$tampil['nik']."</option>"; }?>

Maksud program diatas adalah, dimana user disuguhkan sebuah form

sebagai langkah awal pengisian data ktp. Dimana sistem hanya menambahkan

beberapa

field

tambahan seperti no ktp, masa berlakunya ktp, dan pengisian data

pas photo penduduk ke

field

input penduduk Untuk proses pembuatan Kartu

Tanda Penduduk (KTP). Dan setelah itu, pada saat

user

melakukan penentuan nik

penduduk yang akan dibuatkan ktp, sistem menyuguhkan menu nik pada menu

form option

aplikasi nik dengan

listing program

yang dimaksudkan untuk menampilkan semua nomor nik penduduk yang

telah tercantum didalam sistem.

Lanjutan Program 4 : save_data_ktp.php ( menyimpan data ktp ke database )

<? session_start(); if ($_SESSION['id'] == "1" || $_SESSION['id'] == "3") { ?> <? $no_nik=$_POST['nik']; $no_ktp=$_POST['no_ktp']; if(!empty($_POST['cbo_berlaku'])) { $berlaku=$_POST['cbo_berlaku']; }else{ $berlaku=$_POST['berlaku']; }

/*bagian upload foto*/

$foto=$_FILES["file"]["name"]; $today=date("Y-m-d"); move_uploaded_file($_FILES["file"]["tmp_name"], "images/" . $_FILES["file"]["name"]); include "../../Koneksi/koneksi.php"; $simpan="insert into ktp (no_ktp,no_nik,berlaku,foto,created_at,created_by) values('$no_ktp','$no_nik','$berlaku','$foto','$today','".$_SESSION['i d_user']."')"; if($exc=mysql_query($simpan,$con)) {

echo "<script>alert('Data Berhasil Disimpan, Silah kan lanjut ke proses berikutnya');

self.location.replace('../../index.php'); </script>";}

else {

echo " TERDAPAT Kesalahan Dalam Penginputan Data Atau Data yang diinput Sudah Ada";

} ?>

(29)

Lanjutan Program 4 : hasil_cari_data_ktp.php

<? session_start(); if ($_SESSION['id'] == "1" || $_SESSION['id'] == "2" ) { ?> <html> <head> <meta http-equiv="Content-Type"content="text/html;charset=iso-8859-1"/> <title>Hasil_cari_ktp</title> </head> <body>

<form id="form1" name="form1" method="post" action="index.php?page=hasil_cari_ktp">

<table width="750" border="0" align="left" cellspacing="0" cellpadding="0"> <tr> <td colspan="2">&nbsp;</td> </tr> <tr> <td width="72" height="20">&nbsp;</td> <td width="13">&nbsp;</td> <td width="361">&nbsp;</td> <td width="304">&nbsp;</td> </tr> <tr> <td height="28" class="style22"><span class="style21"><strong>No Ktp</strong></span></td> <td class="style22"><label for="textfield">:</label></td> <td><span class="style21">

<input name="ktp" type="text" class="style22" id="ktp" maxlength="16" /> </span></td> <td>&nbsp;</td> </tr> <tr> <td>&nbsp;</td> <td>&nbsp;</td>

<td><input type="submit" name="Submit" value="C A R I" id="Submit" class="style22" style=" font-size:14px"/></td>

<td>&nbsp;</td> </tr> <tr> <td>&nbsp;</td> <td height="5"><div align="left"> <label for="Submit"></label> </div></td> <td></td> <td>&nbsp;</td> </tr> <tr> <td colspan="4"><? include "Koneksi/koneksi.php"; $ktp = $_POST['ktp'];

$exc = mysql_query ("Select penduduk_detail.nama, ktp.no_ktp,

penduduk_detail.jekel, penduduk_detail.nik FROM

ktp

INNER JOIN penduduk_detail ON ktp.no_nik = penduduk_detail.nik",$con); ?>

(30)

Lanjutan Program 4 : hasil_cari_data_ktp.php

<div align="center">

<table width="68%" border="1" align="left" cellpadding="0" cellspacing="0">

<tr>

<td width="16%" ><div align="center" class="style26">NIK</div></td>

<td width="25%" > <div align="center" class="style27"><span class="style22">Nama Lengkap</span>

</div></td>

<td width="21%" > <div align="center" class="style27"><span class="style22">Jenis Kelamin </span></div></td>

<td colspan="3" ><div align="center">Action</div></td> </tr>

<?

while ($tampil = mysql_fetch_assoc($exc)) { ?>

<tr>

<td height="23" bgcolor="#FFFFCC" ><div align="center" class="style21"><? echo $tampil['nik']; ?></div></td> <td bgcolor="#FFFFCC" ><center>

<div align="center" class="style21"><? echo $tampil['nama']; ?></div></td>

<td bgcolor="#FFFFCC" ><center>

<div align="center" class="style21"><? echo $tampil['jekel']; ?></div></td>

<? if($_SESSION['id']==1){ ?>

<td width="13%" bgcolor="#FFFFCC" class="style21" ><div align="left"><a href="index.php?page=lihat_ktp&&ktp=<? echo $tampil['no_ktp']; ?>">Detail</a></div></td>

<td width="11%" bgcolor="#FFFFCC" class="style21" ><div align="left"><a href="index.php?page=edit_ktp_detail&&ktp=<? echo $tampil['no_ktp']; ?>">Edit</a></div></td>

<td width="14%" bgcolor="#FFFFCC" class="style21" ><div align="left"><a href="index.php?page=delete_data_ktp&&ktp=<? echo $tampil['no_ktp']; ?>">Delete</a></div></td><? }else{ ?>

<td bgcolor="#FFFFCC" class="style21" ><div align="center"><a href="index.php?page=lihat_ktp&&ktp=<? echo $tampil['no_ktp']; ?>">Detail</a></div> <div align="left"></div> </td> <? } ?> </tr> <? }?> </table> </div></td> </tr> </form> </body> </html>

(31)

Gambar 4.4.1

Tampilan Cari Data Ktp Untuk Admin Operator

(32)
(33)

Lanjutan Program 4:update_ktp_detail(menyimpan update dalam database)

Apabila user

(admin operator)

ingin mendelete isi data ktp yang telah dinput

sebelumnya, berikut

listing program

yang tercantum dibawah ini.

<? session_start(); if ($_SESSION['id'] == "1") { ?> <? print_r("<pre>"); print_r($berlaku); print_r("<pre>"); include "../../Koneksi/koneksi.php"; mysql_select_db("data-penduduk2");

$simpan = mysql_query("Update penduduk_detail set

nama='$nama',jekel='$jekel',kewarganegaraan='$kngr',tmpt_lhr='$tmpt_lhr' ,tgl_lhr='$tgl_lhr',agama='$agama',pekerjaan='$pkrj',status='$status',al amat='$alamat',rt_rw='$rt_rw',kelurahan='$kelurahan',kecamatan='$kecamat an',updated_at='$today',updated_by='".$_SESSION['id_user']."' where nik='$nik'",$con); if (!empty ($foto)) {

$simpan1 = mysql_query("Update ktp set

berlaku='$berlaku',foto='$foto',updated_at='$today',updated_by='".$_SESS ION['id_user']."' where no_ktp='$ktp'",$con);

}else {

$simpan1 = mysql_query("Update ktp set

berlaku='$berlaku',updated_at='$today',updated_by='".$_SESSION['id_user' ]."' where no_ktp='$ktp'",$con);

}

if($simpan&&$simpan1) {

echo "<script>alert('Data Telah Berhasil Disimpan'); self.location.replace('../../index.php'); </script>";

} else {

echo "<script>alert('TERDAPAT KESALAHAN DALAM PENGINPUTAN DATA'); self.location.replace('../../index.php');

</script>"; }

(34)

Lanjutan Program 4 : delete_data_ktp (mendelete data ktp didalam

database)

Lanjutan Program 4 : view_data_ktp

<? session_start();

if ($_SESSION['id'] == "1") { ?> <?

include "Koneksi/koneksi.php"; $ktp=$_GET['ktp'];

$exc = mysql_query("delete from ktp where no_ktp='$ktp'",$con); if ($exc)

{

echo "Data telah terhapus <a href=cari_penduduk.php> Lihat Data Laporan </a>"; } else { echo "gagal"; } ?> <? } else {

// tampilkan menu untuk user biasa

echo "<script>alert('Anda Tidak Memiliki Hak Akses')</script>"; echo "<script>self.location.replace('../../index.php')</script>";} ?> <? session_start(); if ($_SESSION['id'] == "1"||$_SESSION['id'] == "2") { ?> <html> <head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link href="../../style.css" rel="stylesheet" type="text/css" /> <title>Untitled Document</title>

<style type="text/css"> <!--

.style3 {font-size: 18px} .style4 {

font-family: Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold; color: #FFFFFF; } --> </style> </head> <body > <? $no_ktp=$_GET['ktp']; $today = date("d-m-Y"); include "Koneksi/koneksi.php"; $excta = mysql_query ("SELECT penduduk_detail.nik, penduduk_detail.nama, penduduk_detail.jekel, penduduk_detail.kewarganegaraan, penduduk_detail.tmpt_lhr, DATE_FORMAT(penduduk_detail.tgl_lhr, '%m-%d-%Y') as tgl_lhr1 , penduduk_detail.agama, penduduk_detail.pendidikan,

(35)

Lanjutan Program 4 : view_data_ktp

Gambar 4.4.4

Tampilan View Kartu Tanda Penduduk ( KTP )

penduduk_detail.pekerjaan, penduduk_detail.goldar, penduduk_detail.`status`, penduduk_detail.hub, penduduk_detail.ayah, penduduk_detail.ibu, penduduk_detail.alamat, penduduk_detail.kelurahan, penduduk_detail.kecamatan, penduduk_detail.no_paspor, penduduk_detail.tgl_akhir_paspor, penduduk_detail.no_akta, penduduk_detail.no_buku_nikah, penduduk_detail.tgl_nikah, penduduk_detail.no_surat_cerai, penduduk_detail.tgl_cerai, penduduk_detail.rt_rw,

DATE_FORMAT(ktp.berlaku, '%m-%d-%Y') as berlaku1 , ktp.no_ktp,

ktp.berlaku, ktp.foto FROM ktp

INNER JOIN penduduk_detail ON ktp.no_nik = penduduk_detail.nik WHERE

(36)

5.

Menu Kartu Keluarga (KK)

Perancangan layar halaman ini berfungsi sebagai proses pembuatan kartu

keluarga. Dimana proses didalamnya terdapat beberapa

field

biodata penduduk

yang telah digunakan dalam proses menu input data penduduk. Dan form data

yang harus di isi meliputi Input nomor KK, dan NIK penduduk yang sudah

tersimpan dalam database. Untuk lebih jelasnya dapat dilihat pada gambar 4.5

berikut ini.

(37)

Program 5 : input_data_kk.php

<? session_start(); if ($_SESSION['id'] == "1" || $_SESSION['id'] == "3") { ?> <html> <head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Input_data_KK</title>

<script src="/wp-includes/js/addInput.js" language="Javascript" type="text/javascript"></script> <script> var counter = 1; var limit = 5; function addInput(divName){ if (counter == limit) {

alert("Maksimum Anggota Keluarga " + counter + " orang"); }

else {

var id = counter;

var newdiv = document.createElement('div'); newdiv.innerHTML = "<table width=\"252\"

border=\"1\"><tr><td width=\"150\" align=\"center\"><select name='nik[]'><?

include "Koneksi/koneksi.php";

$exc = mysql_query ("Select nik from penduduk_detail ",$con); while ($tampil = mysql_fetch_assoc($exc))

{ echo "<option>".$tampil['nik']."</option>"; }?></select></td><td width=\"86\" align=\"center\"><select name='id[]'><option></option><option>2</option><option>3</option><opti on>4</option><option>5</option></select></td></tr></table>"; document.getElementById(divName).appendChild(newdiv); counter++; } } </script> <style type="text/css"> <!--

.style3 {color: #FFFFFF; font-weight: bold; } -->

</style> </head> <body>

<form method="post" action="data/kk/save_kk.php">

<div align="center" style="border:1px solid; margin-left:10px; width:500px; border-color:#CCCCCC;"><br />

<div class="style3" style="width:330px; margin-left:40px; border:1px solid; background:url(images/footer.jpg);">Menu Input KK</div>

<br />

<div style="border:1px solid; margin-left:45px; width:300px" align="center" ><br />

<table width="252" border="1"> <tr>

<td colspan="2"><div align="center">No KK : <input type="text" name="no_kk" maxlength="16" id="username"/><div id="status"></div> </div></td> </tr> <tr> <td width="150"><div align="center">NIK</div></td> <td width="86"><div align="center">ID</div></td> </tr>

(38)

<select name='nik[ ]'>

<?

include "Koneksi/koneksi.php";

$exc = mysql_query ("Select nik from penduduk_detail ",$con);

while ($tampil = mysql_fetch_assoc($exc))

{ echo "<option>".$tampil['nik']."</option>"; }

?></select>

Lanjutan Program 5 : input_data_kk.php

Maksud dari script diatas adalah merupakan penjabaran suatu aksi dari menu

input kk untuk memanggil beberapa fungsi yaitu,

addInput (divName)

untuk

memanggil jumlah data yang di

counter

dengan asumsi batas penambahan 5 (lima

anggota keluarga) dalam daftar kartu keluarga, yang terdiri kepala keluarga, ibu,

anak, ponakan, ade /kakak ipar. Dan pada saat

user

melakukan penentuan nik

penduduk yang akan dimasukkan kedalam kk, sistem menyuguhkan menu nik

yang terlah tersedia pada menu

form option

nik dengan

listing program.

<tr>

<td><div align="center"> <select name='nik[]'><?

include "Koneksi/koneksi.php";

$exc = mysql_query ("Select nik from penduduk_detail ",$con); while ($tampil = mysql_fetch_assoc($exc))

{ echo "<option>".$tampil['nik']."</option>"; }?></select> </div></td> <td><div align="center"> <select name="id[]"> <option>1</option> </select> </div></td> </tr>

</table><label style="margin-left:10px;">Anggota Keluarga</label><div id="dynamicInput">

</div>

<div align="center">

<input type="button" value="Tambah Anggota Keluarga" onClick="addInput('dynamicInput');">

<br />

<br /> <input type="submit" value="Simpan" name="submit" /> </div>

<div align="left">

<p>* id 1 : Kepkel, 2 : ibu, 3 : Anak, 4 Ponakan, 5 Ade/Kakak ipar </p> </div> </div><br /><br /></div> </form> </body> </html>

(39)

Lanjutan Program 5 : save_kk.php (menyimpan data kk ke database)

Pada ketentuan pengguna,

user

yang berperan penting di menu sistem ini

adalah

user entry data

dan

admin operator

. Dimana posisi

user entry data

hanya

dapat mengisi form ketentuan kartu keluarga, sedangkan posisi

user admin

operator

dapat mengisi form, melihat hasil detail pada form kartu keluarga dan

dapat mendelete data KK.

<? session_start();

if ($_SESSION['id'] == "1" || $_SESSION['id'] == "3") { ?>

<?

$today=date("Y-m-d");

foreach ($_POST['nik'] as $key => $val) { $arr[]=$key;

}

$count = max($arr);

include "../../Koneksi/koneksi.php"; for ($i=0; $i<=$count; $i++) {

$simpan="insert into kk (no_kk,nik,id,created_at,created_by)

values('".$_POST['no_kk']."','".$_POST['nik'][$i]."','".$_POST['id'][$ i]."','$today','".$_SESSION['id_user']."')"; $exc=mysql_query($simpan,$con); } if($exc) {

echo "<script>alert('Data Berhasil Disimpan, Silah kan lanjut ke proses berikutnya'); self.location.replace('../../index.php'); </script>"; } else {

echo " TERDAPAT Kesalahan Dalam Penginputan Data Atau Data yang diinput Sudah Ada";

} ?>

(40)

Lanjutan Program 5 : cari_data_kk.php

<? session_start(); if ($_SESSION['id'] == "1" || $_SESSION['id'] == "2" ) { ?> <html> <head></head> <body>

<form id="form1" name="form1" method="post" action="index.php?page=hasil_cari_kk">

<table width="750" border="0" align="left" cellspacing="0" cellpadding="0"> <tr> <td colspan="2">&nbsp;</td> </tr> <tr> <td width="65" height="20">&nbsp;</td> <td width="9">&nbsp;</td> <td width="373">&nbsp;</td> <td width="303">&nbsp;</td> </tr> <tr> <td height="28" class="style22"><span class="style21"><strong>No KK</strong></span></td> <td class="style22"><label for="textfield">:</label></td> <td><span class="style21">

<input name="kk" type="text" class="style22" id="kk" maxlength="16" /> </span></td> <td>&nbsp;</td> </tr> <tr> <td>&nbsp;</td> <td>&nbsp;</td>

<td><input type="submit" name="Submit" value="C A R I" id="Submit" class="style22" style=" font-size:14px"/></td>

<td>&nbsp;</td> </tr> <tr> <td>&nbsp;</td> <td height="5"><div align="left"> <label for="Submit"></label> </div></td> <td></td> <td>&nbsp;</td> </tr> <tr> <td colspan="4"> <? include "Koneksi/koneksi.php"; $kk = $_POST['kk'];

$exc = mysql_query ("SELECT kk.no_kk,

penduduk_detail.nama, penduduk_detail.alamat FROM

kk

INNER JOIN penduduk_detail ON kk.nik = penduduk_detail.nik WHERE kk.id='1'",$con);

(41)

Lanjutan Program 5 : cari_data_kk.php

Lanjutan Program 5 : delete_data_ktp.php

<tr>

<td height="23" bgcolor="#FFFFCC" ><div align="center" class="style21"><? echo $tampil['no_kk']; ?></div></td> <td bgcolor="#FFFFCC" ><center>

<div align="center" class="style21"><? echo $tampil['nama']; ?></div></td>

<td bgcolor="#FFFFCC" ><center>

<div align="center" class="style21">

<div align="left"><? echo $tampil['alamat']; ?></div> </div></td>

<td width="8%" bgcolor="#FFFFCC" class="style21" ><div align="left"> <a href="data/kk/lihat_kk.php?kk=

<? echo $tampil['no_kk']; ?>">Detail</a></div></td> <td width="10%" bgcolor="#FFFFCC" class="style21" ><div align="left"><a href="data/kk/delete_data_kk.php?kk= <? echo $tampil['no_kk'];?>">Delete</a></div></td></tr> </table> </form> </body> </html> <? session_start(); if ($_SESSION['id'] == "1") { include "../../Koneksi/koneksi.php"; $kk=$_GET['kk'];

$exc = mysql_query("delete from kk where no_kk='$kk'",$con); if ($exc)

{

echo "<script>alert('Data Kartu Keluarga Berhasil Dihapus'); self.location.replace('../../index.php');

</script>"; }

else {

echo "<script>alert('Data Gagal Dihapus'); self.location.replace('../../index.php'); </script>";

(42)

Gambar 4.5.1

Menu Form Cari Data Kartu Keluarga(KK)

(43)

6.

Menu Level User Management

Perancangan layar halaman ini berfungsi sebagai data

user account

untuk

menggunakan aplikasi data kependudukan, dimana didalamnya terdiri dari

user

entry data

,

admin operator

, dan

admin staff .

pada form ini sistem juga

menyuguhkan tampilan menu input user apabila ada tambahan

user

yang terlibat

dalam pengerjaan aplikasi data kependudukan. Untuk lebih jelasnya lihat pada

gambar 4.6 berikut ini.

Gambar 4.6

Form Menu Input User Management

Pada ketentuan pengguna,

user

yang berperan penting di menu sistem ini

hanya

user admin operator

, dimana user tersebut dapat menginput

user baru,

merubah password, dan mendelete user account

yang terlibat dalam penggunaan

aplikasi ini.

Apabila jika user admin operator telah melakukan proses menu input user

baru, maka data hasil inputan tersebut akan disimpan dalam database dengan

menggunakan

action script

berikut ini.

Gambar

Gambar 4.1 Halaman Login Pengguna
Gambar 4.2.1 Identifikasi User Pada Menu Halaman Utama
Gambar 4.2.3 Tampilan Menu Pada Admin Staff
Gambar 4.3.2 Menu Input Detail Form Penduduk
+7

Referensi

Dokumen terkait

Selain menggaggu arus lalu litas hal ini juga dapat menyebabkan bahaya bagi pengendara lain nya.Sistem monitoring pelanggar batas lampu lalu lintas dibuat agar

Karena setelah aku sering berwisata ke luar negeri sejak kecil, hotel melati pun di sana sudah cukup bagus, dan justru “tersembunyi” di deretan toko, yang membuat kami bisa

Dalam penelitian yang dilakukan Rahman (2011) tentang Peran manajemen dan tanggung jawab auditor dalam mendeteksi kecurangan laporan keuangan, menemukan Kekeliruan

Para pekerja yang karena berakhirnya kontrak kerja diberhentikan atau kontrak kerjanya tidak dipatuhi oleh pengusaha, kecuali sebagai akibat ketidakcocokkannya untuk bekerja

1) Pemberian pupuk organik cair efektif mendorong pertumbuhan diameter batang, dan berat polong tanaman kacang hijau (Phaseolus radiatus L.) dengan penggunaan POC

Berdasarkan hasil penelitian yang sudah diuji terhadap variabel bebas yang Latihan di Ekstrakurikuler (X1), yang latihan di Klub (X2) dan yang Latihan mandiri (X3)

penelitian ini bertujuan untuk (i) mengidentifikasi faktor kendala utama yang dihadapi petani dalam usaha tani di Desa Pringkuku, (ii) mengidentifikasi teknologi

Dari pemodelan ini, juga dapat disimpulkan bahwa densitas elektron pada kesetimbangan termodinamik untuk plasma hidrogen termal menurun seiring meningkatnya waktu