Dyaz Sofyandi: Aplikasi Sederhana dengan PHP & MySQL

APLIKASI SEDERHANA DENGAN PHP & MySQL

Salam Blogging,

Baru-baru ini saya telah menyelesaikan sebuah aplikasi database pegawai sederhana dengan menggunakan beberapa bahasa pemrograman seperti PHP, MySQL, CSS, dan JavaScript. Aplikasi ini menitikberatkan kepada implementasi PHP dan MySQL dalam pengembangan aplikasi dinamis dan interaktif yang dalam hal ini adalah pengolahan data pegawai yang meliputi aktivitas penambahan data pegawai, ubah data, menghapus data serta menampilkan data pegawai.
Untuk menunjang proses pengembangan telah dikembangkan beberapa fungsi-fungsi buatan yang bertujuan untuk mempermudah dan mempercepat proses penulisan kode program.
Berikut adalah beberapa tampilan screenshotnya:

1. Halaman Depan

2. Daftar Pegawai

3. Form Tambah Pegawai

4. Form Tambah Pegawai dengan Pesan Error

5. Form Edit Pegawai

Dan beberapa fitur lainnya yang sengaja tidak ditampilkan di halaman ini.
Sedangkan untuk struktur tablenya, dapat dilihat sebagai berikut:

1CREATE TABLE IF NOT EXISTS `pegawai` (

2  `pegawai_id` int(11) NOT NULL AUTO_INCREMENT,

3  `kode` varchar(10) NOT NULL,

4  `nama` varchar(50) NOT NULL,

5  `alamat` varchar(100) NOT NULL,

6  `gaji` double NOT NULL,

7  `tanggal_gabung` int(11) NOT NULL,

8  PRIMARY KEY (`pegawai_id`)

9) ENGINE=InnoDB  DEFAULT CHARSET=latin1 AUTO_INCREMENT=7 ;

Kemudian buat sebuah file bernama config.php yang berfungsi untuk mengatur konfigurasi awal website sebagai berikut:

01<?php

02/**

03 * Aplikasi Pegawai Sederhana

04 *

05 * @file config.php

06 * @author Andrew Hutauruk | http://blizze.wordpress.com

07 * @date 17 Aug 2012 23:40

08 */

09

10/**

11 * Koneksi ke server dan memilih database

12 */

13mysql_connect( 'localhost', 'root', '' );

14mysql_select_db( 'blog' );

15

16/**

17 * Fungsi sederhana untuk mempersingkat penulisan kdoe program

18 * Bersifat opsional, tetap bisa menggunakan fungsi PHP pada umumnya

19 */

20function hajar_coy( $query ) { return mysql_query( $query ); }

21function itung_jumlahnya( $query ) { return mysql_num_rows( $query ); }

22function uraikan( $query ) { return mysql_fetch_array( $query ); }

23function bersihkan( $query ) { return mysql_real_escape_string( $query ); }

24

25define( 'URL', 'http://localhost/blog' );

26define( 'NAME', 'Aplikasi Data Pegawai Sederhana' );

27$option = isset( $_GET['option'] ) ? $_GET['option'] : '';

28$action = isset( $_POST['action'] ) ? $_POST['action'] : '';

29?>

Dan file utama yaitu index.php yang berfungsi sebagai tempat untuk melakukan interaksi antara user dengan program kita yaitu sebagai berikut:

01<?php

02/**

03 * Aplikasi Pegawai Sederhana

04 *

05 * @file function.php

06 * @author Andrew Hutauruk | http://blizze.wordpress.com

07 * @date 17 Aug 2012 23:40

08 */

09session_start();

10

11/**

12 * Panggil file config.php

13 */

14require( dirname(__FILE__).'/function.php' );

15

16if( $action == 'Simpan Data Pegawai' ) { simpan_data_pegawai();} 

17elseif( $action == 'Ubah Data Pegawai' ) { update_data_pegawai(); }

18elseif( $option == 'delete-pegawai' ) { hapus_data_pegawai(); }

19?>

20

21<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

22<html xmlns="http://www.w3.org/1999/xhtml">

23<head>

24<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

25<title>

26<?php echo NAME; ?>

27</title>

28<script type="text/javascript">

29function hapus(id){

30    konfirmasi = confirm('Apakah Anda yakin ingin menghapus data pegawai dengan kode: '+id+' ?' );

31    if( konfirmasi == true ) return true;

32    else return false;

33}

34</script>

35<link rel="stylesheet" type="text/css" href="../pegawai/gaya.css" media="all" />

36</head>

37

38<body>

39<div class="bungkus">

40<?php

41    echo mulai_pengurutan( 'urut' );

42    echo isi_pengurutan( buat_link( URL.'/pegawai/', 'Home', 'Home' ) );

43    echo isi_pengurutan( buat_link( URL.'/pegawai/?option=tambah-pegawai', 'Tambah Pegawai', 'Form Tambah Pegawai' ) );

44    echo isi_pengurutan( buat_link( URL.'/pegawai/?option=data-pegawai', 'Data Pegawai', 'Lihat Data Pegawai' ) );

45    echo akhiri_pengurutan();

46     

47    if( $option == 'tambah-pegawai' ) { tambah_data_pegawai(); }

48    elseif( $option == 'data-pegawai' ) { tampilkan_pegawai(); }

49    elseif( $option == 'edit-pegawai' ) { ubah_data_pegawai(); }

50    else {

51        echo "<h1>APLIKASI DATABASE PEGAWAI SEDERHANA</h1>";

52        echo "<p>Selamat datang di Aplikasi Database Pegawai Sederhana.</p>";

53        echo
 "<p><img src=\"".URL."/pegawai/gambar.jpg\" align=\"left\" 
width=\"120\" height=\"150\" class=\"img\">Aplikasi ini sengaja 
dikembangkan dengan harapan dapat memberikan gambaran dan inspirasi bagi
 mereka yang ingin membuat aplikasi dinamis dengan menggunakan PHP dan 
MySQL. Aplikasi ini murni menggunakan pemrograman dasar <b>HTML, 
CSS, PHP dan MySQL</b> serta sedikit bumbu bahasa 
<b>JavaScript</b> agar interaksi pengguna dengan aplikasi 
terasa lebih mantap.</p>";

54        echo
 "<p>Dalam aplikasi telah dikembangkan beberapa fungsi-fungsi 
buatan yang bertujuan untuk membantu proses pengolahan data dan juga 
untuk mempercepat proses penulisan kode program.</p>";

55        echo
 "<p>Secara umum, applikasi ini masih tergolong sangat sederhana 
dan tidak membutuhkan tenaga ekstra untuk mempelajarinya. Anda hanya 
perlu memahami sedikit tentang HTML dan CSS untuk mengatur layout maupun
 tata letak dari setiap komponen website serta pemahaman mendasar 
tentang PHP dan MySQL.</p>";

56        echo
 "<p>Akhirnya, segala kritik dan saran yang membangun sangat 
dibutuhkan agar ke depannya dapat lebih bermamfaat dan semakin antusias 
dalam mengembangkan aplikasi berbasis PHP dan MySQL.</p>";

57        echo "<p class=\"footer\">All Rights Reserved | Copyrights &trade; - ".date("Y")." | View more on: <a href=\"http://blizze.wordpress.com\">Blizze@Wordpress</a></p>";

58    }

59?>

60

61</div>

62</body>

63</html>

Berikut ini adalah jantung dari program kita kali ini yang bernama function.php yang berfungsi untuk mengontrol seluruh aktivitas di dalam aplikasi pegawai tersebut:

001<?php

002/**

003 * Aplikasi Pegawai Sederhana

004 *

005 * @file function.php

006 * @author Andrew Hutauruk | http://blizze.wordpress.com

007 * @date 17 Aug 2012 23:40

008 */

009

010# Panggil file config.php

011require( dirname(__FILE__).'/config.php' );

012

013# Fungsi untuk menyimpan data pegawai

014function simpan_data_pegawai() {

015    # tampung data kesalahan

016    $salah = array();

017     

018    # tangkap data-data yang dimasukkan dari form

019    $nama = bersihkan( $_POST['nama'] );

020    $alamat = bersihkan( $_POST['alamat'] );

021    $gaji = bersihkan( $_POST['gaji'] );

022    $kode = bersihkan( $_POST['kode'] );

023     

024    # validasi data lalu simpan data kesalahan dlm bentuk array, jika ada

025    if( empty( $nama ) ) {

026        $salah[] = '- Pasti Anda manusia dan punya nama, yang benar aja...';

027    }

028    if( empty( $alamat ) ) {

029        $salah[] = '- Masa ga punya tempat tinggal, isi dulu donk...';

030    }

031    if( empty( $gaji ) ) {

032        $salah[] = '- Emang lu kerja ga mau dibayar, isi besar gajilah...';

033    }

034    if( empty( $kode ) ) {

035        $salah[] = '- Isi kode biar Anda nampak unik dan antik coy...';

036    }

037     

038    # jika tidak ada kesalahan

039    if( !count( $salah ) ) {

040         

041        # cek jika sudah ada pegawai yang memiliki kode pegawai yang sama

042        if( itung_jumlahnya( hajar_coy( "SELECT * FROM pegawai WHERE kode='$kode'" ) ) == 0 ) {

043            hajar_coy( "INSERT INTO pegawai VALUES( '$pegawai_id', '$kode', '$nama', '$alamat', '$gaji', '".time()."' )" );

044        } else {

045            $salah[] = '- Sorry ya, kdoe pegawai ini sudah ada yang punya coy...';

046        }

047    }

048     

049    # jika ada kesalahan simpan aja di dalam session

050    if( count( $salah ) ) {

051        $_SESSION['pesan']['kesalahan'] = implode( '<br>', $salah );

052    }

053     

054    # jika terjadi kesalahan kirimkan ke halaman semula sebaliknya kirimkan ke daftar pegawai

055    if( count( $salah ) ) {

056        header( "Location: ".URL."/pegawai/?option=tambah-pegawai" );

057    } else {

058        header( "Location: ".URL."/pegawai/?option=data-pegawai" );

059    }

060    exit;

061} /* Akhir dari fungsi menyimpan data pegawai baru */

062

063# Fungsi untuk mengubah data pegawai

064function update_data_pegawai() {

065    # tampung data kesalahan

066    $salah = array();

067    $kopeg = isset( $_GET['kode'] ) ? $_GET['kode'] : '';

068     

069    # tangkap data-data yang dimasukkan dari form

070    $nama = bersihkan( $_POST['nama'] );

071    $alamat = bersihkan( $_POST['alamat'] );

072    $gaji = bersihkan( $_POST['gaji'] );

073    $kode = bersihkan( $_POST['kode'] );

074     

075    # validasi data lalu simpan data kesalahan dlm bentuk array, jika ada

076    if( empty( $nama ) ) {

077        $salah[] = '- Pasti Anda manusia dan punya nama, yang benar aja...';

078    }

079    if( empty( $alamat ) ) {

080        $salah[] = '- Masa ga punya tempat tinggal, isi dulu donk...';

081    }

082    if( empty( $gaji ) ) {

083        $salah[] = '- Emang lu kerja ga mau dibayar, isi besar gajilah...';

084    }

085    if( empty( $kode ) ) {

086        $salah[] = '- Isi kode biar Anda nampak unik dan antik coy...';

087    }

088     

089    # jika tidak ada kesalahan

090    if( !count( $salah ) ) {        

091        hajar_coy( "UPDATE pegawai SET kode='$kode', nama='$nama', alamat='$alamat', gaji='$gaji' WHERE kode='$kode'" );

092    }

093     

094    # jika ada kesalahan simpan aja di dalam session

095    if( count( $salah ) ) {

096        $_SESSION['pesan']['kesalahan-ubah-data'] = implode( '<br>', $salah );

097    }

098     

099    # jika terjadi kesalahan kirimkan ke halaman semula sebaliknya kirimkan ke daftar pegawai

100    if( count( $salah ) ) {

101        header( "Location: ".URL."/pegawai/?option=edit-pegawai&kode=$kopeg" );

102    } else {

103        header( "Location: ".URL."/pegawai/?option=data-pegawai" );

104    }

105    exit;

106} /* Akhir dari fungsi menyimpan data pegawai baru */

107

108# Fungsi untuk menghapus data pegawai

109function hapus_data_pegawai() {

110    $kode = isset( $_GET['kode'] ) ? $_GET['kode'] : '';

111    hajar_coy( "DELETE FROM pegawai WHERE kode='$kode'" );

112    header( "Location: ".URL."/pegawai/?option=data-pegawai" );

113    exit;

114}

115

116# Fungsi untuk mencari kode pegawia terbesar dari table pegawai

117function cari_terbesar( $kode ) {

118    $query = uraikan( hajar_coy( "SELECT MAX(kode) AS terbesar FROM pegawai" ) );

119    $kode = $query['terbesar'];

120    if( $kode ) {

121        $terbesar = substr( $query['terbesar'], 0, 7 );

122        $terbesar++;

123    } else {

124        $terbesar = 'PEG0001';

125    }

126    return $terbesar;

127}

128

129# Fungsi untuk memformat nilai angka ke dalam rupiah

130function ubah_ke_rupiah( $id ) {

131    return number_format( $id, 0, ", ", "." );

132}

133

134# Fungsi untuk membuat pengurutan sederhana

135function mulai_pengurutan( $id ) {

136    return $html = "<ul id=\"$id\">";

137}

138function isi_pengurutan( $lbl ) {

139    return $html = "<li>$lbl</li>";

140}

141function akhiri_pengurutan() {

142    return $html = "</ul>";

143} /* Akhir dari fungsi pengurutan sederhana */

144

145# Fungsi untuk membuat link anchor sederhana

146function buat_link( $url, $lbl, $title ) {

147    return $html = "<a href=\"$url\" title=\"$title\">$lbl</a>";

148} /* Akhir dari fugnsi anchor link sederhana */

149

150# Fungsi untuk membuat form generator sederhana

151function mulai_form( $method, $action ) {

152    return $html = "<form method=\"$method\" action=\"$action\">";

153}

154function input( $label, $type, $name, $size, $value = "", $readonly = "" ) {

155    if( $readonly && $value == "" ) {

156        $html = "$label<br><input type=\"$type\" name=\"$name\" size=\"$size\"><br>";

157    } else {

158        $html = "$label<br><input type=\"$type\" name=\"$name\" size=\"$size\" value=\"$value\" $readonly><br>";

159    }

160    return $html;

161}

162function akhir_form() {

163    return $html = "</form>";

164}

165

166# Fungsi untuk membuat form tambah pegawai dengan fungsi-fungsi buatan

167function tambah_data_pegawai() {

168    echo "<h1>TAMBAH DATA PEGAWAI</h1>";

169     

170    # cek jika ada terjadi kesalahan selama penambahan data

171    if( isset( $_SESSION['pesan']['kesalahan'] ) ) {

172        echo "<p class=\"err\"><b>Pesan Kesalahan :</b><br>".$_SESSION['pesan']['kesalahan']."</p>";

173        unset( $_SESSION['pesan']['kesalahan'] );

174    }

175     

176    echo mulai_form( 'post', '' );

177    echo input( 'Kode Pegawai:', 'text', 'kode', '20', cari_terbesar( 'kode' ) );

178    echo input( 'Nama Pegawai:', 'text', 'nama', '50', '' );

179    echo input( 'Alamat Pegawai:', 'text', 'alamat', '50', '' );

180    echo input( 'Gaji Pokok Pegawai:', 'text', 'gaji', '20', '' );

181    echo input( '', 'submit', 'action', '', 'Simpan Data Pegawai' );

182    echo akhir_form();

183}

184

185# Fungsi untuk mengubah data pegawai

186function ubah_data_pegawai() {

187    $kode = isset( $_GET['kode'] ) ? $_GET['kode'] : '';

188    $sql = uraikan( hajar_coy( "SELECT * FROM pegawai WHERE kode='$kode'" ) );

189

190    echo "<h1>Ubah Data Pegawai</h1>";

191    if( isset( $_SESSION['pesan']['kesalahan-ubah-data'] ) ) {

192        echo
 "<p class=\"err\"><b>Pesan Kesalahan 
:</b><br>".$_SESSION['pesan']['kesalahan-ubah-data']."</p>";

193        unset( $_SESSION['pesan']['kesalahan-ubah-data'] );

194    }

195

196    echo mulai_form( 'post', '' );

197    echo input( 'Kode Pegawai:', 'text', 'kode', '20', $sql['kode'], 'readonly' );

198    echo input( 'Nama Pegawai:', 'text', 'nama', '50', $sql['nama'] );

199    echo input( 'Alamat Pegawai:', 'text', 'alamat', '50', $sql['alamat'] );

200    echo input( 'Gaji Pokok Pegawai:', 'text', 'gaji', '20', $sql['gaji'] );

201    echo input( '', 'submit', 'action', '', 'Ubah Data Pegawai' );

202    echo input( '', 'hidden', 'kode', '', $sql['kode'] );

203    echo akhir_form();

204}

205

206# Fungsi untuk menampilkan daftar pegawai

207function tampilkan_pegawai() {

208    $data
 = array( "1"=>"NO", "2"=>"Kode Pegawai", "3"=>"Nama", 
"4"=>"Alamat", "5"=>"Gaji Pokok", "6"=>"Tanggal Gabung", 
"7"=>"Options" );

209    $sql = hajar_coy( "SELECT * FROM pegawai" );

210    echo "<h1>Daftar Pegawai</h1>";

211    echo "<table border=\"1\">";

212    echo "<tr class=\"top_tr\">";

213    foreach( $data as $tr ) {

214        echo "  <td>$tr</td>";

215    }

216    echo "</tr>";

217     

218    if( itung_jumlahnya( $sql ) == 0 ) {

219        $col = count( $data );

220        echo "<tr>";

221        echo "  <td colspan=\"$col\">Belum ada data pegawai saat ini</td>";

222        echo "</tr>";

223    } else {

224        $nomor = 1;

225        $a = 0;

226        while( $row = uraikan( $sql ) ) {

227            if( $a == 0 ) { $bg = "#F2F9FD"; $a = 1; }

228            else{ $bg = "#FFFFFF"; $a = 0; }

229            echo "<tr bgcolor=\"$bg\" onmouseover=\"bgColor='#FFFF55'\" onmouseout=\"bgColor='$bg'\">";

230            echo "  <td align=\"center\">{$nomor}</td>";

231            echo "  <td>{$row['kode']}</td>";

232            echo "  <td>{$row['nama']}</td>";

233            echo "  <td>{$row['alamat']}</td>";

234            echo "  <td>Rp ".ubah_ke_rupiah( $row['gaji'] )."</td>";

235            echo "  <td align=\"center\">".date( "d/m/Y", $row['tanggal_gabung'] )."</td>";

236            echo
 "  <td align=\"center\">".buat_link( 
URL."/pegawai/?option=edit-pegawai&kode={$row['kode']}", "<img 
src=\"".URL."/pegawai/b_edit.png\">", "Ubah Data Pegawai" )." <a 
href=\"".URL."/pegawai/?option=delete-pegawai&kode={$row['kode']}\" 
onclick=\"return hapus('".$row['kode']."')\"><img 
src=\"".URL."/pegawai/b_drop.png\"></a></td>";

237            echo "</tr>";

238            $nomor++;

239        }       

240    }

241    echo "</table>";

242}

243?>

Dan yang terakhir adalah file gaya.css untuk mengatur bentuk serta sususan dan tata letak aplikasi:

01/* GAYA PEGAWAI */

02*{ margin: 0; padding: 0; }

03body{
 font-family: Arial, Helvetica, sans-serif; font-size: 12px; 
line-height: 1.5em; background: #EDEDED; text-shadow: 0px 1px 0px #fff; 
color: #222;}

04a{ color: #2ABFFF; text-decoration: none; -moz-transition: .3s ease-in-out; }

05a:hover{ color: #D40000; text-decoration: none; }

06h1{
 margin:  10px 0; padding: 10px; border: 1px solid #FFBF55; 
text-transform: uppercase; color: #000000; font-weight: normal; 
background: #FFFF55; }

07img{ margin: 0; padding: 0; border: none; }

08form{ margin: 10px 0; padding: 10px; background: #E1E1E1; border: 1px solid #CDCDCD; box-shadow: 0px 1px 0px #fff; }

09input{
 margin: 2px 0 10px 0; padding: 5px; font-size: 13px; font-family: 
Arial, Helvetica, sans-serif; border: 1px solid #B4B4B4; }

10ol,ul{ margin: 0; padding: 0; list-style-type: none; height: 40px; background: #FFDFFF; border: 1px solid #009F00; }

11li{ float: left; display: inline; }

12li
 a{ color: #2A00FF; padding: 12px 20px; line-height: 40px; font-weight: 
bold; border-right: 1px solid #FFDFFF; border-left: 1px solid #FFDFFF;}

13li a:hover{ background: #AADFFF; color: #000000; border: 1px solid #009F00; padding: 17px 20px; border-radius: 3px; }

14table{ margin: 0; padding: 0; border: 1px solid #464646; border-collapse: collapse; width: 100%; box-shadow: 0px 1px 0px #fff;}

15tr{ text-align: left; height: 25px; }

16tr.top_tr{ height: 40px; font-weight: bold; background: #EEFF00; }

17td{ margin: 0; padding: 3px; }

18div.bungkus{ margin: 20px auto; padding: 0; width: 70%; }

19p{ margin: 0; padding: 10px 0; text-align: justify; }

20p.err{ margin: 10px 0; padding: 10px; color: #FF0000; border: 1px solid #FF3F00; background: #FFFFFF;}

21p.footer{ margin: 10px 0; padding: 3px 7px; font-size: 11px; border: 1px solid #D2D2D2; box-shadow: 0px 1px 0px #fff; }

22img.img{ margin: 0; padding: 5px 15px 5px 0; }

Program ini tentunya masih jauh dari kata sempurna namun tentu tidak akan mengurangi niat baik saya untuk saling berbagai pengalaman sehingga yang belum pernah mencobanya dapat memiliki pengalaman tersendiri dengan adanya tutorial ini. Semoga membantu.

Dyaz Sofyandi

Chelsea

Chelsea 2

Chelsea 3

Chelsea 4

Chelsea 5

Twitter Updates

Saturday, March 9, 2013

Aplikasi Sederhana dengan PHP & MySQL

APLIKASI SEDERHANA DENGAN PHP & MySQL

0 comments:

Post a Comment

Blog Archive

About this blog