Guru SMK BIMA: Mei 2009

Pada modul sebelumnya kita telah belajar cara menampilkan data dengan menggunakan DAO, di sini kita akan membuat aplikasi kelanjutan yaitu proses insert, update, dan delete pada DAO. Sebelum memulai kita akan merubah sedikit konfigurasi dari file ‘application.xml’ kita yang ada pada modul 10 menjadi berikut:

<?xml version="1.0" encoding="utf-8"?>

<application id="modul11" mode="Debug">

<paths>

<using namespace="System.Web.*" />

<using namespace="System.Web.UI.*" />

<using namespace="System.Data.*" />

</paths>

<modules>

<module id="myDB" class="TDataSourceConfig">

<database ConnectionString="mysql:host=localhost;dbname=modul9" Username="root" Password="" />

</module>

</modules>

<services>



<service id="page" class="TPageService" BasePath="Application.App_Page" DefaultPage="Index" />

</services>

</application>

Dimana sistem parameter kita rubah menjadi sistem module tanpak pada kode di atas, setelah itu kita akan membuat tampilan pada Index.page maka kode programnya adalah sebagai berikut:

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

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

<head>

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

<title>Modul 11</title>

</head>

<body>

<com:TForm ID="mod11">

<h1>DAO Insert, Update, Delete</h1>

<hr />

<h3>Insert</h3>

<table width="75%" border="0">

<tr>

<td>Username</td>

</tr>

<tr>

<td><com:TTextBox ID="txtUser" MaxLength="6" /></td>

</tr>

<tr>

<td>Password</td>

</tr>

<tr>

<td><com:TTextBox ID="txtPass" TextMode="Password" MaxLength="6" /></td>

</tr>

<tr>

<td>Role</td>

</tr>

<tr>

<td><com:TDropDownList ID="ddlRole" PromptText="-- Role --" PromptValue="0" SelectedIndex="0" DataTextField="nama_role" DataValueField="kd_role" /></td>

</tr>

<tr>

<td><com:TButton ID="btnSave" Text="Save" OnClick="btnSave_OnClick" /></td>

</tr>

</table>

<hr />

<h3>Update, Delete</h3>

<com:TDataGrid ID="dgView"

AutoGenerateColumns="false"

AllowPaging="true"

PageSize="10"

DataKeyField="Username"

HeaderStyle.BackColor="black"

HeaderStyle.ForeColor="white"

ItemStyle.BackColor="#BFCFFF"

ItemStyle.Font.Italic="true"

AlternatingItemStyle.BackColor="#E6ECFF"

OnPageIndexChanged="dgView_OnPageIndexChanged"

OnItemCreated="dgView_OnItemCreatedCommand"

OnCancelCommand="dgView_OnCancelCommand"

OnDeleteCommand="dgView_OnDeleteCommand"

OnEditCommand="dgView_OnEditCommand"

OnUpdateCommand="dgView_OnUpdateCommand"

>

<com:TLiteralColumn

ID="colUsername"

HeaderText="Username"

HeaderStyle.Wrap="false"

DataField="Username" />

<com:TBoundColumn

ID="colPassword"

HeaderText="Password"

HeaderStyle.Wrap="false"

DataField="Password" />

<com:TDropDownListColumn

ID="colRole"

HeaderText="Role"

HeaderStyle.Wrap="false"

DataTextField="Role"

ListValueField="kdRole"

ListTextField="namaRole"

ListDataSource="<%=$this->LoadListGrid%>"

/>

<com:TEditCommandColumn

ID="colUpdate"

HeaderText="Perbaharui"

HeaderStyle.Wrap="false"

UpdateText="Save" />

<com:TButtonColumn

ID="colDelete"

HeaderText="Delete"

ItemStyle.HorizontalAlign="Center"

ItemStyle.Font.Italic="false"

Text="Delete"

CommandName="delete" />

</com:TDataGrid>

</com:TForm>

</body>

</html>

Tampak pada warna biru merupakan tampilan untuk program Insert kita sedangkan pada warna hijau untuk update dan delete dengan menggunakan sistem Data Grid yang merupakan kontrol dari PRADO yaitu TDataGrid.

Setelah itu kita akan memulai dari pengkodean dari tampilan yang kita buat untuk melakukan Insert atau penyimpanan ke table yang ada pada table kita event pada “btnSave_OnClick” adapun kode programnya adalah sebagai berikut:

public function btnSave_OnClick($sender, $param){

try {

$sql = "INSERT INTO tblLogin VALUES(:userLogin, DES_ENCRYPT(:passwordLogin), :kdRole)";

// protected from hacking by using PRADO Component

// TPropertyValue::ensureXXX

$userLogin = TPropertyValue::ensureString($this->txtUser->Text);

$passLogin = TPropertyValue::ensureString($this->txtPass->Text);

$kdRole = TPropertyValue::ensureInteger($this->ddlRole->SelectedValue);

$conn = $this->Application->Modules['myDB']->Database;

$conn->Active = true;

$command = $conn->createCommand($sql);

// created bindParameter ref. from PDO at PHP Manual

// protected again from hacking

// read: http://www.php.net/manual/en/function.PDOStatement-bindParam.php

$command->bindParameter(":userLogin", $userLogin, PDO::PARAM_STR);

$command->bindParameter(":passwordLogin", $passLogin, PDO::PARAM_STR);

$command->bindParameter(":kdRole", $kdRole, PDO::PARAM_INT);

$command->execute();

$conn->Active = false;

// refresh data grid

$this->doLoadGrid();

}

catch(Exception $e){

throw new TConfigurationException($e);

}

}

private function doListRole(){

try {

$conn = $this->Application->Modules['myDB']->Database;

$conn->Active = true;

$sql = "SELECT * FROM tblRole";

$dr = $conn->createCommand($sql)->query();

$this->ddlRole->DataSource = $dr;

$this->ddlRole->dataBind();

$conn->Active = false;

}

catch(Exception $e){

throw new TConfigurationException($e);

}

}

Proses penyimpanan data ke dalam tabel telah selesai untuk menghindari kesalahan maka kode baris ” $this->doLoadGrid();” dapat kita remark sementara. Setelah itu kita akan membuat kode program untuk melihat tampilan ke dalam TDataGrid yang berfungsi untuk Edit dan Delete dengan menambahkan kode berikut:

public function OnLoad($param){

parent::OnLoad($param);

if(!$this->IsPostBack){

$this->doListRole();

$this->doLoadGrid();

}

}

private function doLoadGrid(){

try {

$this->dgView->DataSource = $this->loadData();

$this->dgView->dataBind();

}

catch(Exception $e){

throw new TConfigurationException($e);

}

}

private function loadData(){

try {

$conn = $this->Application->Modules['myDB']->Database;

$conn->Active = true;

$sql = "SELECT l.user_login, DES_DECRYPT(l.password_login) AS password_login, r.nama_role ";

$sql .= "FROM tblLogin l, tblRole r ";

$sql .= "WHERE l.kd_role = r.kd_role";

$dr = $conn->createCommand($sql)->query();

$i = 0;

foreach($dr as $key){

$array[$i] = array('Username'=>$key['user_login'], 'Password'=>$key['password_login'], 'Role'=>$key['nama_role']);

$i++;

}

$conn->Active = false;

return $array;

}

catch(Exception $e){

throw new TConfigurationException($e);

}

}

Di dalam menampilkan data ke dalam TDataGrid kita menggunakan Array yang terdapat pada function ”loadData()”, sedangkan untuk menampilkan data pada TDataGrid kita menggunakan function ”doLoadDataGrid()”. Hal yang cukup diperhatikan disini adanya fungsi ”TDropDownListColumn” berguna untuk menampilkan DropDownList ketika kita akan melakukan edit data, untuk membuat data kontrol dari TDropDownListColumn maka kita menggunakan kode program berikut:

public function getLoadListGrid(){

try {

$sql = "SELECT * FROM tblRole";

$conn = $this->Application->Modules['myDB']->Database;

$conn->Active = true;

$dr = $conn->createCommand($sql)->query();

$list = new TList;

foreach($dr as $key){

$list->add(array('kdRole'=>$key["kd_role"], 'namaRole'=>$key['nama_role']));

}

$conn->Active = false;

return $list;

}

catch(Exception $e){

throw new TConfigurationException($e);

}

}

Di sini kita menggunakan kontrol TList untuk menampung data ke dalam event TDropDownList dimana ini sesuai dengan petunjuk yang terdapat dalam PRADO dokument. Setelah itu kita akan menambahkan kode pada TDataGrid untuk memberikan message box jika kita akan melakukan penghapusan data dengan menambahkan kode program berikut:

public function dgView_OnItemCreatedCommand($sender, $param){

$item = $param->Item;

if($item->ItemType === 'EditItem'){

$item->colPassword->TextBox->TextMode = 'Password';

}

if($item->ItemType==='Item' || $item->ItemType==='AlternatingItem' || $item->ItemType==='EditItem'){

$item->colDelete->Button->Attributes->onclick='if(!confirm(\'Apakah Anda yakin akan menghapusnya?\')) return false;';

}

}

Setelah itu kita melakukan penaganan untuk melakukan edit data dengan menambahkan kode program berikut:

public function dgView_OnEditCommand($sender, $param){

$this->dgView->EditItemIndex = $param->Item->ItemIndex;

$this->doLoadGrid();

}

Ketika kita menekan tombol edit maka akan tampak gambar pada samping maka di sini kita akan melakukan penaganan kode program yang terdiri ”save” dan ”cancel”, maka kita akan membuat kode program tersebut:

Untuk menagani tombol ”Save” berarti di sini user akan melakukan update data:

public function dgView_OnUpdateCommand($sender, $param){

$item = $param->Item;

$this->updateLogin(

$this->dgView->DataKeys[$item->ItemIndex],

$item->colPassword->TextBox->Text,

$item->colRole->DropDownList->SelectedValue

);

$this->dgView->EditItemIndex = -1;

$this->doLoadGrid();

}

private function updateLogin($_username, $_password, $_role){

$trans = NULL;

try {

$_username = TPropertyValue::ensureString($_username);

$_password = TPropertyValue::ensureString($_password);

$_role = TPropertyValue::ensureInteger($_role);

$sql = "UPDATE tblLogin ";

if($_password != NULL){

$sql .= "SET password_login=DES_ENCRYPT('".$_password."'), kd_role=".$_role;

} else {

$sql .= "SET kd_role=".$_role;

}

$sql .= " WHERE user_login='".$_username."'";

$conn = $this->Application->Modules['myDB']->Database;

$conn->Active = true;

$trans = $conn->beginTransaction();

$command = $conn->createCommand($sql);

$command->execute();

$trans->commit();

$conn->Active = false;

}

catch(Exception $e){

$trans->rollBack();

throw new TConfigurationException($e);

}

}

Di dalam proses Update kita menggunakan sistem transaction yang berfungsi untuk menagani jika dalam proses update ada kesalahan maka perintah query yang kita jalankan bisa kita lakukan pembatalan (rollback) namun jika sukses maka kita menyimpannya (commit). Jika user melakukan pembatalan dengan menekan ”Cancel” maka kode programnya adalah

public function dgView_OnCancelCommand($sender, $param){

$this->dgView->EditItemIndex = -1;

$this->doLoadGrid();

}

Setelah itu kita akan membuat event untuk penghapusan data adapun kode programnya adalah sebagai berikut:

public function dgView_OnDeleteCommand($sender, $param){

$item = $param->Item;

$this->deleteLogin($this->dgView->DataKeys[$item->ItemIndex]);

$this->dgView->EditItemIndex = -1;

$this->doLoadGrid();

}

private function deleteLogin($_username){

$trans = NULL;

try {

$_username = TPropertyValue::ensureString($_username);

$sql = "DELETE FROM tblLogin ";

$sql .= " WHERE user_login='".$_username."'";

$conn = $this->Application->Modules['myDB']->Database;

$conn->Active = true;

$trans = $conn->beginTransaction();

$command = $conn->createCommand($sql);

$command->execute();

$trans->commit();

$conn->Active = false;

}

catch(Exception $e){

$trans->rollBack();

throw new TConfigurationException($e);

}

}

Setelah semua proses selesai ada satu listing program yang harus kita tambahkan yang berfungsi untuk membuat pagging atau batas data yang akan kita buat adapun kode programnya adalah sebagai berikut:

public function dgView_OnPageIndexChanged($sender, $param){

$this->dgView->CurrentPageIndex = $param->NewPageIndex;

$this->doLoadGrid();

}

Kita telah belajar tentang penggunaan Insert, Update dan Delete pada PRADO dengan mengunakan DAO jika kita perhatikan begitu mudahnya membuat aplikasi dengan mengunakan PRADO. Berikut adalah tampilan program secara keselurahan

Tampilan Hasil Akhir Program

Setelah kita mempelajari tentang SQL Statement pada MySQL sekarang kita akan belajar tentang Data Access Object (DAO) pada PRADO. Perlu diperhatikan didalam penggunaan koneksi database dalam PRADO selalu mengunakan PHP Data Objects (PDO) sehinga kita harus memastikan bahwa modul PDO telah aktif dalam Server kita dengan mengceknya terlebih dahulu. Jika PDO telah terinstall maka akan tampak tampilan pada gambar 10.1 sebagai berikut:

Gambar 10.1 Konfigurasi PDO Aktif

Seperti tampak pada gambar 10.1 bahwa PDO telah diaktif, untuk mengetahui konfigurasinya dengan mengakses http://localhost:8081/xampp/phpinfo.php pada browser Anda. Di mana PDO pada server penulis dapat menangani database berjenis MS SQL, MySQL, dan SQLite 2.

Setelah PDO aktif sekarang waktunya kita mengkonfigurasi aplikasi kita dengan melakukannya pada file “application.xml”, untuk menghubungkan database dengan PDO pada ADO kita dapat menggunakan beberapa parameter koneksi yaitu:

MySQL: mysql:host=ALAMAT_SERVER_DB;dbname=NAMA_DB

SQLite: sqlite:/path/tod/dbfile

ODBC: odbc:NAMA_ODBC

Setelah kita mengetahui parameter koneksi kini saatnya kita membuat parameter dalam “application.xml” yang kita letakkan setelah “<services>”, adapun codenya adalah sebagai berikut:

<parameters>

<parameter id="myDSN" value="mysql:host=localhost;dbname=modul9" />

<parameter id="myUser" value="root" />

<parameter id="myPass" value="" />

</parameters>

Kemudian jangan lupa untuk melakukan include/import class TParameterModule pada path kita dengan menuliskan “System.Util.ParameterModule” serta tidak lupa untuk memasukkan kelas untuk mengakses database “System.Data.*”, adapun data “application.xml” secara lengkap tampak pada listing berikut:

<?xml version="1.0" encoding="utf-8"?>

<application id="modul10" mode="Debug">

<paths>

<using namespace="System.Web.*" />

<using namespace="System.Web.UI.*" />

<using namespace="System.Data.*" />

<using namespace="System.Util.TParameterModule" />

</paths>

<modules />

<services>

<service id="page" class="TPageService" BasePath="Application.App_Page" DefaultPage="Index" />

</services>

<parameters>

<parameter id="myDSN" value="mysql:host=localhost;dbname=modul9" />

<parameter id="myUser" value="root" />

<parameter id="myPass" value="" />

</parameters>

</application>

Disini kita mengunakan database yang telah kita buat pada Modul 9 sebelumnya. Sehinga program kita nanti dapat berkomunikasi dengan database yang telah kita buat sebelumnya. Setelah itu kita akan membuat UI pada ”Index.page” adapun source codenya adalah sebagai berikut:

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

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

<head>

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

<title>Modul 10</title>

</head>

<body>

<com:TForm ID="mod10">

<h1>Menampilkan data Login</h1>

<com:TDataGrid ID="dgView" AutoGenerateColumns="false" AllowPaging="true" DataKeyField="user_login" HeaderStyle.BackColor="black" HeaderStyle.ForeColor="white" ItemStyle.BackColor="#BFCFFF" ItemStyle.Font.Italic="true" AlternatingItemStyle.BackColor="#E6ECFF">

<com:TBoundColumn HeaderText="Username" HeaderStyle.Wrap="false" DataField="user_login" />

<com:TBoundColumn HeaderText="Password" HeaderStyle.Wrap="false" DataField="password_login" />

<com:TBoundColumn HeaderText="Kode Role" HeaderStyle.Wrap="false" DataField="kd_role" />

</com:TDataGrid>

</com:TForm>

</body>

</html>

Sedangkan untuk logic controlnya yaitu ”Index.php” adalah sebagai berikut:

<?php

class Index extends TPage {

private $_conn;

public function OnLoad($param){

  parent::OnLoad($param);

  try {

   $this->_conn = new TDbConnection($this->Application->Parameters['myDSN'],

    $this->Application->Parameters['myUser'],

    $this->Application->Parameters['myPass']);

   $this->_conn->Active = true;

   $sql = "SELECT * FROM tblLogin";

   $dr = $this->_conn->createCommand($sql)->query();

   $rows = $dr->readAll();

   if(!$this->Page->IsPostBack){

    $this->dgView->DataSource = $rows;

    $this->dgView->dataBind();

   }

  }

  catch(Exception $e){

   die($e);

  }

}

public function __destruct(){

  $this->_conn->Active = false;

}

}

?>

Disini fungsi OnLoad($param) dalam Visual Basic sama dengan Form_Load sehinga proses datagrid pada TDataGrid dapat kita diproses pada awal proses dimana ada perintah !$this->Page->IsPostBack untuk menghandle pemrosesan hanya dilakukan pada awal kali proses jika halaman mengalami refresh maka tidak akan dilakukan penulisan ulang, untuk function __ destruct() merupakan function dari PHP 5 (Chapter 59. General Information, PHP Manual) yang berfungsi untuk menutup koneksi database. Adapun hasil dari program kita tampak pada gambar 10.2

Gambar 10.2 Hasil dari tampilan program

Dimana hasil diatas bisa kita modifikasi sesuai keinginan kita di dalam mengembangkan aplikasinya. Untuk modul berikuntya kita akan belajar insert, update, dan delete dengan ADO.

Guru SMK BIMA

Menu Tab

KOMPAS.com - Edukasi

Selasa, 26 Mei 2009

Download Modul Kelas XI dalam ‌PDF (2)

DAO (Insert, Update, & Delete)

Jumat, 08 Mei 2009

Tugas 4 (Perorangan)

Data Access Object pada PRADO

Belanja

Iklan