kode File style.css
.tableheader{ background:#999999; color:#FFFFFF; text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black; height:30px; } #column_padding{ padding-left:2%; } td a { text-decoration:none; color:#0033CC; /8text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;*/ } td a:hover{ color:yellow; text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black; } #rowHover:hover { background:#CCCCCC;; } #removeborder{ border:0px; height:35px; } .form{ margin:0px; margin-left:15px; } input[type="text"]{ width:95%; } input[type="radio"]{ width:20%; } .tableadd { background:#CCCCCC; padding:20px; border:solid 1px; } #berhasil { width:20%; background:#009933; color:#fff; text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black; } #row_button { } #button_tambah{ background:blue; color:#FFFFFF; padding:3px; border:solid 1px yellow; margin-left:1%; }
kode File index.php
<html> <head> <title>Aplikasi CRUD PHP</title> <link href="style.css" type="text/css" rel="stylesheet" /> </head> <body> <div align="center"> <h2>DAFTAR PEGAWAI KSP PUTRA LANGIT</h2> <h4>Contoh Aplikasi CRUD Dengan PHP</h4> </div> <table border="1" width="60%" style="border-collapse:collapse;" align="center"> <tr class="tableheader"> <th rowspan="1">Kode Pegawai</th> <th>Nama Pegawai</th> <th>Jenis Kelamin</th> <th>Aksi</th> </tr> <tr id="rowHover"> <td width="10%" align="center">30001</td> <td width="25%" id="column_padding">Samsul Arifin</td> <td width="10%" id="column_padding">Pria</td> <td width="10%;" align="center"><a href="">Ubah</a> || <a href="">Hapus</a></td> </tr> <tr id="removeborder"> <td colspan="5"> <form class="form" method="post" action=""> <input type="submit" value="Tambah Pegawai" /> </form> </td> </tr> </table> </body> </html>Kode File tambah.php
<html> <head> <title></title> <link href="style.css" type="text/css" rel="stylesheet" /> </head> <body> <div align="center"> <h2>XXXXXXXX PEGAWAI</h2> <h4>Contoh Aplikasi CRUD Dengan PHP</h4> </div> <table align="center" width="30%;" border="0" class="tableadd"> <form class="form" action="proses.php" method="post" onSubmit="return Check()" name="myform"> <tr> <td width="30%">Kode Pegawai</td> <td> : <input type="text" name="kode" value=""/></td> </tr> <tr> <td width="30%">Nama Pegawai</td> <td>: <input type="text" name="nama" value="" /></td> </tr> <tr> <td width="30%">Jenis Kelamin</td> <td> : <input type="radio" name="grup1" value="Pria" /> Pria <input type="radio" name="grup1" value="Wanita" /> Wanita </td> </tr> <tr> <td colspan="2"> <input type="submit" value="Simpan" style="width:30%;" /> <input type="hidden" name="status" value="" /> </td> </tr> </form> </table> </body> <script type="text/javascript"> function Check(){ if(document.myform.nama.value == ""){ alert("Data Masi Kosong !!!"); return false; } } </script> </html>Sampek sini desain HTML/CSS/JavaScript udah selesai... :D untuk koneksi ke databasenya kita setting dalam satu file saja biar gak ribet + ruet... begini kodenya...
Kode File config.php
<?php mysql_connect("localhost","root",""); mysql_select_db("kantor"); ?>ente bisa sesuaikan dengan database ente... sebelum memulai memanipulasi data sebaiknya kita cek dulu kode2 diatas... kalo ente running di browser, maka tampilannya akan seperti ini....
tampilan file index.php
tampilan file tambah.php
setelah tampilan ente bener seperti itu... sekarang saatnya ente nyoba load data dari Database... kalo ente udah baca tentang function di postingan sebelumnya, tentu ente paham cara incude file ke file lain di PHP.. menggunakan keyword include "<namafile>" include kan file config kedalam file index.php... dan ambilah data pegawai dari database.. kemudian tampilkan kedalam tabel... itu algoritmanya... dan begini jadinya kode pada file index.php
<?php include 'config.php'; $data = mysql_query("select * from pegawai"); ?> <html> <head> <title>Aplikasi CRUD PHP</title> <link href="style.css" type="text/css" rel="stylesheet" /> </head> <body> <div align="center"> <h2>DAFTAR PEGAWAI KSP PUTRA LANGIT</h2> <h4>Contoh Aplikasi CRUD Dengan PHP</h4> </div> <table border="1" width="60%" style="border-collapse:collapse;" align="center"> <tr class="tableheader"> <th rowspan="1">Kode Pegawai</th> <th>Nama Pegawai</th> <th>Jenis Kelamin</th> <th>Aksi</th> </tr> <?php while($hasil = mysql_fetch_array($data)){ ?> <tr id="rowHover"> <td width="10%" align="center"><?php echo $hasil['kodepegawai']; ?></td> <td width="25%" id="column_padding"><?php echo $hasil['namapegawai']; ?></td> <td width="10%" id="column_padding"><?php echo $hasil['jeniskelamin']; ?></td> <td width="10%;" align="center"> <a href="tambah.php?status=edit&kode=<?php echo $hasil['kodepegawai']; ?>"> Ubah</a> || <a href="proses.php?kode=<?php echo $hasil['kodepegawai']; ?>" onClick="return confirm('Anda yakin akan menghapus data ini ?')"> Hapus</a></td> </tr> <?php } ?> <tr id="removeborder"> <td colspan="5"> <a href="tambah.php?status=tambah&kode" id="button_tambah">Tambah Pegawai</a> </td> </tr> </table> </body> </html>pada program diatas, setelah menginclude kan file config.php kita mengambil data dari database... kemudian ditampung pada variabel "$data"... pada tabel row (<tr>) kita menampilkan data... kalo ente baca postingan ane tentang PHP dasar tentang while pasti ente tahu kegunaan while yaitu untuk perulangan... jadi data yang kita ambil dari database kita tampilkan dengan while dan mysql_fetch_array(<isi variabel penampung data>) ... pada link tambah, ubah, hapus ente perhatikan ada file proses.php dan tambah.php nantinya kita akan memulai manipulasi data lewat file ini... kita bahas dulu file tambah.php... file ini adalah form untuk menambah dan mengubah data.. apa bisa dalam 1 form melakukan proses yang berbeda (tambah dan hapus) ?? ya bisa2 saja... kenapa dibuat sulit... caranya memakai "IF"... jadi jika data yang akan kita masukkan itu baru berarti kita menginsert/menambah data.. jika datanya adalah data lama maka kita mengupdate/mengubah data itu... dan kita perlu satu variabel sebagai temporary status... untuk pengiriman data ke file PHP ada 2 cara.. dengan mengunakan Get dan Post...Get untuk pengiriman data menggunakan parameter... untuk penggunaan Get di PHP kita... ente lihat link tambah dan edit pada potongan kode diatas... tambah.php?status=tambah&kode dan tambah.php?status=edit&kode=<?php echo $hasil['kodepegawai']; ?> setelah kode tambah.php ada tanda tanya itu, berarti kita menggunakan parameter.. nama parameternya adalah status dan di isi dengan tambah / edit.. kemudian pada parameter yang kedua yaitu kode, pada status tambah ane kosongin karena ini adalah databaru... sedangkan pada status edit ane tambahkan kodepegawai...
trus bagaimana cara mengambil data yang ada pada parameter itu ??
perhatikan kode program ini... kode yang ada pada file tambah.php
<?php include "config.php"; $nama = ""; $jenis = ""; if($_GET['status'] == "edit"){ $data = mysql_query("select * from pegawai where kodepegawai = '".$_GET['kode']."'"); while($hasil = mysql_fetch_array($data)){ $nama = $hasil['namapegawai']; $jenis = $hasil['jeniskelamin']; } } ?> <html> <head> <title></title> <link href="style.css" type="text/css" rel="stylesheet" /> </head> <body> <div align="center"> <h2><?php echo strtoupper($_GET['status']); ?> PEGAWAI</h2> <h4>Contoh Aplikasi CRUD Dengan PHP</h4> </div> <table align="center" width="30%;" border="0" class="tableadd"> <form class="form" action="proses.php" method="post" onSubmit="return Check()" name="myform"> <tr> <td width="30%">Kode Pegawai</td> <td> : <input type="text" name="kode" value="<?php echo $_GET['kode']; ?>" <?php if($_GET['status'] == 'edit'){ ?> readonly="readonly" <?php } ?>/></td> </tr> <tr> <td width="30%">Nama Pegawai</td> <td>: <input type="text" name="nama" value="<?php echo $nama; ?>" /></td> </tr> <tr> <td width="30%">Jenis Kelamin</td> <td> : <input type="radio" name="grup1" value="Pria" <?php if($jenis == "" || $jenis == "Pria"){?> checked="checked" <?php } ?> /> Pria <input type="radio" name="grup1" value="Wanita" <?php if($jenis == "Wanita"){?> checked="checked" <?php } ?> /> Wanita </td> </tr> <tr> <td colspan="2"> <input type="submit" value="Simpan" style="width:30%;" /> <input type="hidden" name="status" value="<?php echo $_GET['status']; ?>" /> </td> </tr> </form> </table> </body> <script type="text/javascript"> function Check(){ if(document.myform.nama.value == ""){ alert("Data Masi Kosong !!!"); return false; } } </script> </html>
pada file tambah.php ini kita tetep mengincludekan file config.php karena kita akan melakukan manipulasi data ke database... untuk mengambil parameter PHP menggunakan kode $_GET['<nama parameter?'] .. ente bisa sesuaikan dengan nama parameternya... karena dalam satu form melakukan dua proses yang berbeda yaitu insert dan update.. kita perlu adanya variabel temporary... pada file tambah.php itu kan ada variabel $nama dan $kelamin yang kita deklarasikan setelah include file config.php dan kita isikan nilai kosong pada variabel2 tersebut... kemudian kita lakukan validasi status... jika statusnya edit maka kita mengambil data dari database dan kita masukkan ke dalam variabel temporary tersebut...
mysql_query("select * from pegawai where kodepegawai = '".$_GET['kode']."'");
kode diatas ini untuk pengambilan data yang memanfaatkan parameter kode sebagai kondisi data yang kita ambil dari database...
jika statusnya tambah ya gak usah diapa2in... karena memang nantinya pada textfield kalo datanya baru kan memang gak ada isinya... hehehhehe...
setelah melakukan validasi dan pengisian nilai dengan kondisi... kita tampilkan datanya pada form...
contoh kita menampilkan nama... jika datanya baru maka textfield akan kosong jika datanya lama maka textfield akan terisi dengan data...
<input type="text" name="nama" value="<?php echo $nama; ?>" />
lalu bagaimana kita menyimpannya data yang baru / yang lama ini ke database... tidak beda juga dengan pengambilan data ini... pada proses penyimpanan data juga menggunakan status... jika datanya baru maka insert jika datanya lama maka update... maka kita memerlukan input type hidden yang nilainya kita isi dengan status... ente bisa lihat pada contoh kode program diatas... oia untuk penyimpanan data ini kita menggunakan POST ...kalo tadi pengiriman data dengan parameter dengan Get kalo ini dengan POST.. apa bedanya?? secara definisi ane bingung jelasinnya... hehehhe langsung ke prakteknya saja ya ?? i.Alloh nanti ngerti-ngerti sendiri...
kita akan melakukan proses penyimpanan pada file proses.php ... makanya pada tag form, atribut action kita tulis proses.php dan method nya menggunakan post ...kita akan mengirim data kesana.. oia sebelum mengirim data kesana pada komponen form ente kasi nama semua... karena untuk pengambilan datanya nanti itu memakan nama komponen itu sendiri...
<?php include 'config.php'; if(isset($_GET['kode'])){ $kode = $_GET['kode']; mysql_query("delete from pegawai where kodepegawai = $kode"); header("location:index.php?kode=3"); exit(0); } $kode = isset($_POST['kode']) ? $_POST['kode'] : NULL; $nama = isset($_POST['nama']) ? $_POST['nama'] : NULL; $jenis = isset($_POST['grup1']) ? $_POST['grup1'] : NULL; $status = isset($_POST['status']) ? $_POST['status'] : NULL; if($status == "tambah"){ mysql_query ("insert into pegawai values ('".$kode."','".$nama."','".$jenis."')"); header("location:index.php?kode=1"); exit(0); }else{ mysql_query("update pegawai set namapegawai = '".$nama."', jeniskelamin = '".$jenis."' where kodepegawai = '".$kode."';"); //echo "update pegawai set namapegawai = '".$nama."', jeniskelamin = '".$jenis."' where kodepegawai = '".$kode."';"; header("location:index.php?kode=2"); exit(0); } ?>pada file proses tentunya kita harus mengincludekan kembali file config.php... oke ente bisa lihat pada program diatas... untuk pengambilan data dari $_POST['<nama variabel>'] kita samakan dengan nama komponen tersebut dan kita tampung pada beberapa variabel yang kita perlukan... setelah itu kita validasi lagi.... jika status edit maka kita melakukan update data jika statusnya tambah maka menginsert data... kode header("location:index.php?kode=1") kode ini akan mengarahkan ke file index setelah proses manilpulasi data dan kode 1 sebagai kode penampil pesan pada index.php ...
untuk link delete pada index.php algoritmanya tidak jauh berbeda dengan data lama yang diubah tadi yaitu menggunakan method GET ($_GET['<nama variabel>'] tetapi prosesnya penghapusan datanya ada pada file proses.php....
ini beberapa screen shoot dari program diatas...
bagi ente yang mau download contoh program lengkapnya, monggo... ada disini
Terima Kasih..
ReplyDeleteSalam mantaps..
sama2 gan :)
Deletekeren OM ..
ReplyDeletekeren Om ..
ReplyDeletenampkny keren in gan..
ReplyDeletethanks ya .. gan