Wednesday, May 19, 2010

Pop-Up Bantuan Mencari Data (PHP-MySQL)

Oleh Achmad Faisol

Misal ada sebuah aplikasi evaluasi pegawai, dimana atasan akan menilai/memberi komentar atas kualitas kerja anak buahnya.

Di form entri, tentu harus ada isian Nopeg pegawai yang akan dievaluasi. Umumnya, atasan tidak hapal nopeg setiap pegawai, apalagi jumlah pegawai cukup banyak. Ada 2 solusi untuk hal ini, yaitu:
  • Nopeg berbentuk combo box, sehingga tidak perlu ditulis, cukup klik combo box yang ada. Sayangnya, model ini akan memberatkan sistem bila data pegawai sangat banyak.
  • Nopeg berbentuk text box, namun ada tombol ellipsis (…) untuk menampilkan data pegawai bila dibutuhkan. Bisa juga berbentuk short cut, misalnya penekanan tombol F9. Data pegawai yang ditampilkan pun tidak semuanya, jadi ada proses pencarian dulu sehingga lebih efisien. Model jenis inilah yang akan diuraikan di posting kali ini.
1. Script create database dan table di MySQL

create database hrd;

use hrd;

CREATE TABLE pegawai(
nopeg int unsigned auto_increment NOT NULL,
nama varchar(24) NOT NULL,
jk enum('L','P'),
alamat varchar(24),
kota varchar(16),
PRIMARY KEY (nopeg)
);

CREATE TABLE evaluasi_pegawai(
nopeg int NOT NULL,
hasil_evaluasi varchar(100),
tgl_evaluasi datetime
);


INSERT INTO pegawai VALUES (1, 'ani', 'P', 'Jl. Apel 15', 'BANDUNG');
INSERT INTO pegawai VALUES (2, 'ali', 'L', 'Jl. Duren 2', 'JAKARTA');
INSERT INTO pegawai VALUES (3, 'adi', 'L', 'Jl. Jambu 20', 'JAKARTA');
INSERT INTO pegawai VALUES (4, 'bobi', 'L', 'Jl. Padjajaran 12', 'BOGOR');
INSERT INTO pegawai VALUES (5, 'budi', 'L', 'Jl. Semut 12', 'JAKARTA');


2. File form_evaluasi.php
File ini untuk mengisi evaluasi pegawai oleh atasan.

2.1 Source code form_evaluasi.php

<html>
<script>

function bantuan() {

sUrl="bantuan_data_peg.php"; features = 'toolbar=no, left=350,top=100, ' +
'directories=no, status=no, menubar=no, ' +
'scrollbars=no, resizable=no, width=300, height=450';

window.open(sUrl,"winChild",features);
}//bantuan

function bantuanF9(){
s=window.event.keyCode;
//alert (s); //F9 = 120

if ( s == 120) {
bantuan();
}
}//bantuanF9</script>

Silakan Isi Hasil Evaluasi Pegawai PT XYZ:
<pre>
<form method=post name=frmEvaluasi action=evaluasi.php>
No Peg : <input type=text name=txtNopeg size=5 onKeyDown=bantuanF9()>
<input type=button value="..." onClick=bantuan()>

Hasil Evaluasi : <textarea name=txtEvaluasi rows=4 cols=20></textarea>

<input type=submit value=kirim> <input type=reset value=batal>
</form>
Catatan:
Bila lupa Nopeg, klik button Ellipsis (...) atau tekanF9 saat kursor di text box Nopeg.
</pre>
</html>
2.2 tes di browser http://10.1.1.2/evaluasi_peg/form_evaluasi.php

IP PC 10.1.1.2 boleh diganti dengan localhost atau sesuai IP Web Server yang digunakan.


3. File dbconnect.php
File ini untuk koneksi ke database MySQL. Di contoh ini, Web Server Apache dan MySQL ada di 1 PC dengan IP Address 10.1.1.2

3.1 Source code dbconnect.php

<?php

$connected=mysql_connect('10.1.1.2','root','inix2010');

if ( ! $connected ) {

print ("Koneksi ke MySQL Server Gagal !!! <BR>");

}
else {

//print ("Koneksi ke MySQL Server Sukses !!!<BR>");

}

$retval=mysql_select_db("hrd",$connected);

if ( $retval ) {

//print ("Koneksi ke database hrd OK<BR>");

}

else {

print ("Database hrd tidak dapat diakses<BR>");

}

?>

4. File bantuan_data_peg.php
File ini merupakan pop up bantuan yang digunakan untuk menampilkan data pegawai yang tidak diketahui nomer pegawainya.

4.1 Source code bantuan_data_peg.php

<html>

<script>

function keParent(no_peg){

//menulis ke text box Nopeg di form_evaluasi.php opener.document.frmEvaluasi.txtNopeg.value = no_peg;

}

</script>

<pre>

<form method=post action=bantuan_data_peg.php>

Nama Pegawai : <input type=text name=txtNama size=20>

<input type=submit name=btnSubmit value=Cari!>

<input type=reset>

</form>

</pre>

</html>

<?php
$tombol = $_POST['btnSubmit'];

if ($tombol != null) {

$nama = $_POST['txtNama'];

include("dbconnect.php");

$kueri= "select nopeg,nama from pegawai " . "where nama like '%" . $nama . "%' order by nopeg";

//print "$kueri";

$rs=mysql_query($kueri);

$row=mysql_fetch_object($rs);
if ($row){

//jika data yang dicari ada

print "<TABLE BORDER=1>";

print "<TR bgcolor=lightblue> <TH>No Pegawai <TH>Nama </TR>";

//menampilkan record do{

print "<TR>"; print "<TD> $row->nopeg </TD>";

print "<TD> <a href=javascript:void(0) onClick=keParent($row->nopeg)>$row->nama </a></TD>";

print "</TR>";

}while ($row=mysql_fetch_object($rs));

print "</TABLE>";

}//if ($row)

else {

print "<h4> Data Tidak Ada...</h4>";

}//data tidak ada

}//tombol submit di klik

?>


4.2 Tampilan bantuan_data_peg.php ketika di form_evaluasi.php tombol Ellipsis (…) diklik.

Misal akan dicari pegawai yang namanya mengandung “a”. Di text box Nama Pegawai (jendela pop up), ketik huruf “a”, lalu klik tombol “Cari”.



Di jendela pop up, tampil semua pegawai yang namanya mengandung huruf “a”. Di kolom Nama, ada hyperlink di tiap-tiap record. Jika salah satu hyperlink nama diklik, misalnya ali, maka di window pemanggil (form_evaluasi.php), text box Nopeg otomatis terisi Nomer Pegawai Ali. Begitu juga bila diklik nama lain.

5. File evaluasi.php
File ini memproses input evaluasi dari program PHP untuk dimasukkan ke table “evaluasi_pegawai” di database MySQL .

5.1 Source code evaluasi.php

<?php

include "dbconnect.php";

$nopeg=$_POST['txtNopeg'];

$evaluasi=$_POST['txtEvaluasi'];

$qry="INSERT INTO evaluasi_pegawai VALUES ('$nopeg','$evaluasi',now())";

$rs=mysql_query($qry);

mysql_close();

//echo $qry;

?>

<SCRIPT LANGUAGE=JAVASCRIPT>

alert ("pengisian evaluasi sukses");

window.location='form_evaluasi.php';

</SCRIPT>

5.2 Tampilan program evaluasi.php



Setelah form evaluasi diisi, lalu tombol “Kirim” diklik, akan muncul pesan (alert) bahwa penyimpanan data evaluasi sukses.


Posted by at
Labels: , ,

15 comments:

  1. AnonymousOctober 1, 2010 at 6:11 AM

    Agam Gusriyandi
    ini bgt gan yang gw cari thks bgt
    http://www.agam-on.blogspot.com

    ReplyDelete
  2. AnonymousDecember 2, 2010 at 6:34 PM

    Sekalian di share/upload file source codenya.
    thanks

    ReplyDelete
  3. AnonymousJanuary 27, 2011 at 1:42 AM

    mau tanya kalau yang ditampilkan ke textbox setelah click nama itu alamatnya gimana ya ? saya coba sepertinya itu gak mau yang bertype varchar ??

    ReplyDelete
  4. RizalApril 7, 2011 at 11:21 AM

    sangat membantu,,
    mau tanya,, klo ditampilkan ke beberapa textbox gimana ya,,! yg ini kan baru nampilin satu,,ke textbox Nopeg di form_evaluasi. nah klo ada Nopeg,Nama,Alamat,Kota,NoTelp. gimana ya pengembangan script'y? saya lg perlu sangadh,, ^_^ .trimakasih

    ReplyDelete
  5. Just ShareJanuary 10, 2012 at 2:14 PM

    Mantap gan... Sangat Membantu

    ReplyDelete
  6. AnonymousJanuary 10, 2012 at 2:24 PM

    Nga runnig Gun.. ohon pencerahanx kalau bisa file demonx and uploadtanx gan. Thanks

    ReplyDelete
  7. AnonymousMay 23, 2012 at 2:59 PM

    Kasih link download gan...

    ReplyDelete
  8. Hilman FirmansyahJuly 22, 2012 at 1:01 PM

    mantep.. makasih mas.. sangat membantu..

    ReplyDelete
  9. sutarnoNovember 16, 2012 at 10:47 AM

    sangat membantu, saya pakai php 5.3.8, jadi saya tambah isset, jadinya
    $tombol = isset($_POST['btnSubmit']);
    gimana caranya supaya pop langsung di tutup pas salah satu hyperlink nama diklik,

    ReplyDelete
  10. AnonymousNovember 27, 2013 at 2:43 AM

    mantappp.... helpfull nh...

    ReplyDelete
  11. Hadi SetionoFebruary 3, 2014 at 6:54 PM

    thank gan.. bantu banget
    http://www.jempool.com

    ReplyDelete
  12. Muhammad IqbalJune 29, 2015 at 11:24 AM

    kalo data varchar koq ga bisa dimasukkan ke text box ya gan...

    ReplyDelete
  13. UnknownOctober 6, 2016 at 6:29 PM

    Ingin beruntung seperti temen-temen kamu?

    Langsung saja kamu mendaftar di AsliBandar dan rasakan permainan yang akan membuat hidupmu berwarna.

    Dengan Deposit yang terjangkau kamu berkesempatan menangkan Jackpot setiap harinya.

    Ingin beruntung seperti temen-temen kamu?

    Langsung saja kamu mendaftar di www.AsliBandar.net dan rasakan permainan yang akan membuat hidupmu berwarna.

    Dengan Deposit yang terjangkau kamu berkesempatan menangkan Jackpot setiap harinya.

    Untuk Info lebih lanjut silahkan menghubungi kami melalui :

    Pin BB : 2B3C34F4
    YM : Aslibandar_CS
    Skype : AsliBandar
    Telp : +855882388666
    FB : AsliBandar

    ReplyDelete
  14. michele wijayaMarch 27, 2018 at 11:07 PM

    Halo Bossku ^^
    Segera Daftarkan ID di skb288,com
    Menyediakan 7 Permain Hanya Dengan 1 ID
    Serta Tersedia Promo Menarik
    Bonus Turn Over Terbesar
    Bonus Refferal Seumur Hidup
    Minimal Deposit Hanya 20Rb
    BBM : D8E87241
    WA : +62 878 8707 6927
    Di Tunggu Kehadirannya Bossku ^^

    ReplyDelete
  15. EkiJuly 20, 2018 at 2:52 PM

    Thanks banyak gan. Semoga ilmunya berkah jadi amal jariyah. Amin.

    ReplyDelete

Subscribe to: Post Comments (Atom)