Cara Menggunakan Fitur Hook pada CodeIgniter

Fitur hook yang disediakan pada CodeIgniter sebenarnya memungkinkan kita untuk sedikit melakukan hack pada proses yang berjalan pada aplikasi yang kita buat, tanpa harus mengubah skrip pada file inti CodeIgniter. Misalnya saja, kita ingin membuat sebuah log untuk menyimpan data URL apa saja yang diakses oleh pengguna, mendata setiap pengunjung yang mengakses halaman, dll. Dalam kasus dibawah ini kita akan menggunakan fitur hook untuk mengatur konfigurasi aplikasi berdasarkan konfigurasi yang kita simpan di database.

Langkah-langkahnya adalah sebagai berikut:

1. Membuat tabel app_config untuk menyimpan konfigurasi aplikasi kita

   CREATE TABLE IF NOT EXISTS `app_config` (
     `key` varchar(255) NOT NULL,
     `value` varchar(255) NOT NULL,
     PRIMARY KEY (`key`)
   ) ENGINE=InnoDB DEFAULT CHARSET=latin1;
   

2. Memasukkan data konfigurasi awal kedalam tabel yang telah kita buat

   INSERT INTO `app_config` (`key`, `value`) VALUES
     ('address', 'Griya Wilis Indah'),
     ('company', 'Belva Tekindo'),
     ('email', ''),
     ('fax', ''),
     ('language', 'indonesia'),
     ('phone', ''),
     ('timezone', 'Asia/Bangkok'),
     ('version', '1.0');
   

3. Membuat file application/models/m_appconfig.php untuk mengakses tabel yang telah kita buat

   <?php
   class M_appconfig extends CI_Model
   {	
   	function get_all()
   	{
   		$this->db->from('app_config');
   		$this->db->order_by("key", "asc");
   		return $this->db->get();		
   	}
   }
   
   /* End of file m_appconfig.php */
   /* Location: ./application/models/m_appconfig.php */
   

4. Menambahkan model M_appconfig pada file application/config/autoload.php agar di load otomatis
   

   $autoload['model'] = array('M_appconfig');
   

5. Membuat file application/hooks/load_config.php

   <?php
   function load_config()
   {
   	$CI =& get_instance();
   	
   	//Memuat konfigurasi dari database kefalam konfigurasi global CI
   	foreach($CI->M_appconfig->get_all()->result() as $app_config)
   	{
   		$CI->config->set_item($app_config->key,$app_config->value);
   	}
   	
   	//Set konfigurasi timezone CI dengan konfigurasi dari database
   	if ($CI->config->item('timezone'))
   	{
   		date_default_timezone_set($CI->config->item('timezone'));
   	}	
   }
   
   /* End of file load_config.php */
   /* Location: ./application/hooks/load_config.php */
   

6. Mengaktifkan fitur ini pada file application/config/config.php seperti berikut:
   

   $config['enable_hooks'] = TRUE ;
   

7. Mendefinisikan hook yang akan digunakan pada saat aplikasi kita dijalankan. Buka file application/config/hooks.php untuk menambah hook baru.
   

   $hook['post_controller_constructor'] = array(
                                   'class'    => '',
                                   'function' => 'load_config',
                                   'filename' => 'load_config.php',
                                   'filepath' => 'hooks'
                                   );
   

Berikut ini merupakan hal yang harus diperhatikan dalam pembuatan hook. Yaitu poin dimana hook akan dijalankan. Terdapat tujuh poin dimana hook akan kita tempatkan, pada contoh diatas hook ditempatkan pada poin post_controller_constructor. Berikut penjelasan ketujuh poin tersebut.

• pre_system
  Kelas dan metode hook kita akan dijalankan sebelum sistem dieksekusi. Berdasar dokumentasi CodeIgniter, hanya kelas Benchmark dan Hook yang dijalankan pada poin ini.
• pre_controller
  Kelas dan metode hook akan dijalankan sebelum controller kita dipanggil. Semua base class, routing dan security sudah dipanggil pada poin ini.
• post_controller_constructor
  Akan dipanggil ketika konstruktor controller dijalankan, tapi sebelum metode controller dipanggil.
• post_controller
  Akan dipanggil ketika controller sudah benar-benar dijalankan.
• display_override
  Memungkinkan kita untuk menentukan metodologi display sesuai dengan keinginan kita.
• cache_override
  Mengijinkan kita untuk menampilkan mekanisme cache sesuai dengan keinginan kita.
• post_system
  Dijalankan ketika halaman berhasil dikirim ke browser.

Baca selengkapnya »

Validasi Form Menggunakan jQuery Validation Plugin

jQuery Validation adalah sebuah plugin jQuery yang berfungsi untuk mempermudah validasi form client-side. Cara penggunaannya adalah dengan memanggil script jquery dan jquery-validate di dlm kode html anda (biasanya diletakkan di bagian head):
Mari kita mulai dengan contoh sederhana. Klik disini untuk melihat demo. Bentuk demonstrasi tersebut berisi empat bidang: nama, e-mail, komentar dan URL. Seperti yang Anda lihat, pertama tiga bidang yang diperlukan, sedangkan bidang URL adalah opsional. Jika Anda mengirimkan formulir tanpa mengisi kolom yang diperlukan, Anda akan menerima pesan kesalahan.

Berikut adalah kode yang digunakan untuk bentuk dalam demonstrasi di atas.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
  <head>
  <title>Simple Form Validation</title>
  <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
  <script type="text/javascript" src="http://dev.jquery.com/view/trunk/plugins/validate/jquery.validate.js"></script>
  <script type="text/javascript">
    $(document).ready(function() {
      $("#form1").validate({
        rules: {
          name: "required",// simple rule, converted to {required:true}
          email: {// compound rule
          required: true,
          email: true
        },
        url: {
          url: true
        },
        comment: {
          required: true
        }
        },
        messages: {
          comment: "Please enter a comment."
        }
      });
    });
  </script>
  <style type="text/css">
    * { font-family: Verdana; font-size: 11px; line-height: 14px; }
    .submit { margin-left: 125px; margin-top: 10px;}
    .label { display: block; float: left; width: 120px; text-align: right; margin-right: 5px; }
    .form-row { padding: 5px 0; clear: both; width: 700px; }
    label.error { width: 250px; display: block; float: left; color: red; padding-left: 10px; }
    input[type=text], textarea { width: 250px; float: left; }
    textarea { height: 50px; }
  </style>
  </head>
  <body>
    <form id="form1" method="post" action="">
      <div class="form-row"><span class="label">Name *</span><input type="text" name="name" /></div>
      <div class="form-row"><span class="label">E-Mail *</span><input type="text" name="email" /></div>
      <div class="form-row"><span class="label">URL</span><input type="text" name="url" /></div>
      <div class="form-row"><span class="label">Your comment *</span><textarea name="comment" ></textarea></div>
      <div class="form-row"><input class="submit" type="submit" value="Submit"></div>
    </form>
  </body>
</html>

Kode tersebut diatas cukup mudah dan tidak perlu banyak penjelasan. Namun, ada beberapa poin penting yang harus di perhatian yaitu:

• Harus selalu menyertakan pustaka jQuery dan plugin validasi bassistance, di bagian head.
• Selalu menetapkan atribut id dari bentuk dan atribut name semua field yang ingin divalidasi.

Selanjutnya kita lihat fungsi validate() secara rinci.

$(document).ready(function() {
  $("#form1").validate({
    rules: {
      name: "required",    // simple rule, converted to {required: true}
      email: {             // compound rule
      required: true,
      email: true
      },
      url: {
        url: true
      },
      comment: {
        required: true
      }
    },
    messages: {
      comment: "Please enter a comment."
    }
  });
});

Yang kita lakukan adalah menginisialisasi form validasi menggunakan fungsi validate(). Ada beberapa parameter yang bisa kita gunakan. Dalam contoh di atas, kita hanya menggunakan dua diantaranya, untuk melihat daftar pilihan fungsi validate() silahkan klik di sini.

Dua parameter kita digunakan adalah:

• rules: memungkinkan Anda untuk menentukan field yang akan divalidasi. Dalam kasus ini, kita memvalidasi nama, email, url dan komentar. Untuk setiap field, kita bisa menentukan bahwa data diperlukan untuk suatu field (required: true). Kita bisa pula menentukan bahwa suatu data adalah berupa alamat e-mail yang valid, URL yang valid, dll.
• messages: memungkinkan Anda untuk menentukan pesan kesalahan untuk field tertentu (seperti kolom komentar dalam contoh di atas). Jika Anda tidak menentukannya, maka pesan default yang akan ditampilkan "this field is required".

Baca selengkapnya »

Submit Form Dengan Ajax Menggunakan jQuery

Pada website biasa ketika kita mengklik suatu tombol/link tertentu maka browser akan melakukan refresh dimana document HTML akan di baca dari awal dan layar browser akan menjadi blank sesaat, karena pada saat itu browser sedang meminta/merequest data dari web server. Hal ini tentu membuat aplikasi website menjadi kurang interaktif dan responsif. Ajax digunakan untuk memecahkan masalah tersebut, Ajax membuat aplikasi website menjadi lebih interaktif dan responsif serta memiliki kecepatan dalam memproses request ke server. Salah satu kelebihan menggunakan form berbasis Ajax dibandingkan form konvensional adalah yaitu kita tidak perlu meninggalkan form selama form dikirimkan/diproses.

Berikut ini akan di dijelaskan bagaimana cara membuat submit form dengan Ajax menggunakan jQuery Versi 1.2.3, kita menggunakan dua buah file, yang pertama adalah file ajaxform.html untuk menampilkan form-nya, dan file proses.php untuk memproses data yang dikirimkan dan menampilkan hasilnya.

Script pada file ajaxform.html nya adalah sbb:

<!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>
<title>AJAX Form</title>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js' type='text/javascript'/>
<script type="text/javascript">
$(document).ready(function() {

 $().ajaxStart(function() {
  $('#loading').show();
  $('#result').hide();
 }).ajaxStop(function() {
  $('#loading').hide();
  $('#result').fadeIn('slow');
 });

 $('#myForm').submit(function() {
  $.ajax({
   type: 'POST',
   url: $(this).attr('action'),
   data: $(this).serialize(),
   success: function(data) {
    $('#result').html(data);
   }
  })
  return false;
 });
})
</script>
<style type="text/css">
body, table, input, select, textarea { font: 11px/20px Verdana, sans-serif; }
h4 { font-size: 18px; }
input { padding: 3px; border: 1px solid #999; }
td { padding: 5px; }
#result { background-color: #F0FFED; border: 1px solid #215800; padding: 10px; width: 400px; margin-bottom: 20px; }
</style>
</head>
<body>
<h4>AJAX Form</h4>
<div id="loading" style="display:none;"><img src="loading.gif" alt="loading..." /></div>
<div id="result" style="display:none;"></div>
<form id="myForm" method="post" action="proses.php">
 <table>
  <tr>
   <td width="100">NIM</td>
   <td>
    <input name="nim" size="30" type="text" />
   </td>
  </tr>
  <tr>
   <td>Nama</td>
   <td>
    <input name="nama" size="40" type="text" />
   </td>
  </tr>
  <tr>
   <td>Tempat Lahir</td>
   <td>
    <input name="tempat_lahir" size="40" type="text" />
   </td>
  </tr>
  <tr>
   <td>Tanggal Lahir</td>

   <td>
    <input name="tgl_lahir" size="40" type="text" />
   </td>
  </tr>
  <tr>
   <td>Alamat</td>
   <td>
    <input name="alamat" size="60" type="text" />
   </td>
  </tr>
  <tr>
   <td>No. Telp</td>
   <td>
    <input name="no_telp" size="30" type="text" />
   </td>
  </tr>
  <tr>
   <td>No. HP</td>
   <td>
    <input name="no_hp" size="30" type="text" />
   </td>
  </tr>
  <tr>
   <td>E-mail</td>
   <td>
    <input name="email" id="email" size="30" type="text" />
   </td>
  </tr>
  <tr>
   <td></td>
   <td>
    <input type="submit" value="Submit" />
    <input type="reset" value="Reset" />
   </td>
  </tr>
 </table>
</form>
</body>
</html>

Untuk mengimplementasikan Ajax, pada file form.html ini kita gunakan fungsi ajax () pada jQuery. Fungsi ini memiliki sebuah argumen yaitu berupa object (pasangan key/value), dan yang akan kita gunakan di antaranya adalah sbb:

• type: jenis request yang dipakai, bisa 'POST' atau 'GET'
• url: url yang akan digunakan untuk memproses data. karena pada form sudah terdapat nilai action (proses.php) maka saya tinggal mengambil nilai dari action tsb menggunakan $(this).attr('action')
• data: data yang dikirimkan, dalam format querystring. untuk menghasilkan querystring dari form, saya menggunakan fungsi serialize()
• success: fungsi yang akan dijalankan jika request berhasil, dengan sebuah argumen berupa data yang dikembalikan dari server, dalam hal ini adalah hasil output dari file proses.php (hasil output ini akan saya tampilkan ke dalam sebuah div dengan id="result" )

Sedangkan file proses.php yang akan memproses data yang dikirimkan, isinya adalah sbb:

<?php
//validasi
if (trim($_POST['nim']) == '') {
 $error[] = '- NIM harus diisi';
}
if (trim($_POST['nama']) == '') {
 $error[] = '- Nama harus diisi';
}
if (trim($_POST['tempat_lahir']) == '') {
 $error[] = '- Tempat Lahir harus diisi';
}
//dan seterusnya
 
if (isset($error)) {
 echo '<b>Error</b>: <br />'.implode('<br />', $error);
} else {
 /*
 jika data mau dimasukkan ke database,
 maka perintah SQL INSERT bisa ditulis di sini
 */
 
 $data = '';
 foreach ($_POST as $k => $v) {
  $data .= "$k : $v<br />";
 }
 echo '<b>Form berhasil disubmit. Berikut ini data anda:</b>';
 echo '<br />';
 echo $data;
}
die();
?>

Setelah file proses.php ini berhasil dijalankan maka hasil outputnya akan ditampilkan pada element div yang berada pada file ajaxform.html

Baca selengkapnya »

Menghilangkan index.php pada URL CodeIgniter

Secara default url CI adalah seperti berikut ini

http://localhost/NamaAplikasi/index.php/NamaController

Caranya:

Buat file dengan nama .htaccess di www root Anda.

RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ index.php/$1 [L]  

Buka file config.php, set

$config['index_page'] = ''

Baca selengkapnya »

Master dan Slave pada Harddisk

Pada dasarnya master dan slave pada harddisk sama saja, hanya saja yang membedakan adalah prioritas utama pembacaan data harddisk oleh bios. Jadi apabila anda memiliki dua harddisk, yang ke-1 harddisk anda berisi OS dan yang ke-2 berupa data, maka harddisk yang ke-1 jadikan master dan yang ke-2 jadikan slave.

Cara menyetting master dan slave pada harddisk dapat kita lakukan melalui pemasangan jumper, apabila harddisk bertipe IDE/ATA, sedangkan untuk harddisk SATA melalui pemasangan kabel data konektor SATA pada motherboard.

Cara Penyetingan Master dan Slave Pada Harddisk IDE/ATA

Pada HDD ATA dalam pengaturan Master dan Slave sangat mudah. Hanya dengan mengganti jumper pada HDD-nya. Dan keterangan penempatan jumper itu pun selalu ada pada HDD-nya. Misalnya seperti gambar dibawah ini. Ini adalah salah satu contoh penyetingan jumper pada HDD IDE/ATA untuk menentukan Master atau Slave.

Cara Penyetingan Master dan Slave Pada Harddisk SATA

Berbeda dengan harddisk SATA, dalam SATA konsep Master-Slave seperti yang biasa ditemukan pada IDE/ATA sudah dihilangkan karena setiap device yang terhubung melalui SATA memiliki satu channel/port khusus. Setting untuk mengubah drive sata menjadi slave bisa kita lakukan dengan menempatkan kabel SATA pada motherboard. Pada gambar dibawah ini dapat kita lihat terdapat perbedaan warna pada port SATA pada motherboard, dan perbedaan warna inilah yang membedakan antara Master dan Slave. Misalnya port yang berwarna hitam yaitu port 1 dan 2 adalah Master sedangkan port yang berwarna merah yaitu port 3 dan 4 yaitu slave. Keterangan ini tergantung pada tiap-tiap motherboard dan biasanya pada motherboardnya terdapat keterangan mana yang master dan yang slave.

Baca selengkapnya »

Membuat Partisi dan Memformat Harddisk

Master atau Slave

Hardisk adalah sebuah device (hardware) komputer yang sangat penting karena operating sistem dan program-program berada dalam hardisk. Ada dua jenis hardisk yang sering dipakai yaitu ATA dan SATA. Ciri hardisk ATA adalah menggunakan kebel data bernama IDE. Sedangkan SATA menggunakan kabel data bernama SATA.
Keberadaan hardisk di komputer dibagai menjadi tiga kategori yaitu:

• Hardisk Location (Lokasi hardisk)
• Hardisk Position (Posisi hardisk)
• Hardisk Patition (Partisi hardisk)

Hardisk Location ditentukan oleh keberadaan hardisk tersebut yang terhubung pada motherboard berupa  Primary atau Secondary.
Hardisk Position ditentukan oleh keberadaan hardisk tersebut yang terhubung pada motherboard berupa Master atau Slave.
Hardisk Partition ditentukan oleh pembagian dalam hardisk tersebut.

Struktur Partisi Harddisk

Bagi pengguna Windows, Kebanyakan orang (khususnya pemula) akan lebih mengenal C atau D dibandingkan dengan Partisi Primary atau Extended. Padahal sebenarnya bukan itu yang disebut partisi. Tulisan C, D atau E dst disebut sebagai drive Letter atau symbol untuk kemudahan operasional partisi.

Struktur data dalam Master Boot Record

Struktur hard disk dalam skema partisi Master Boot Record

Di dalam Master Boot Record, terdapat sebuah tabel partisi yang menjelaskan di mana partisi-partisi diletakkan di dalam hard disk. Skema partisi ini hanya terdapat di dalam sistem Intel x86, dan diimplementasikan dalam system BIOS sistem tersebut.
Dalam skema partisi ini, partisi terbagi menjadi tiga buah jenis, yakni

• Primary Partition atau partisi utama, yakni partisi yang dapat digunakan untuk melakukan proses booting sistem operasi dan menyimpan data pengguna. Jumlahnya hanya empat buah saja dalam satu hard disk. Jika terdapat sebuah partisi tambahan, maka jumlahnya akan berkurang menjadi tiga buah partisi utama.
• Extended Partition atau partisi tambahan, yakni partisi yang dapat menampung beberapa partisi logis. Partisi ini sebenarnya merupakan salah satu jenis dari partisi utama. Jumlahnya hanya boleh satu buah saja.
• Logical Partition atau partisi logis, yakni partisi yang tidak dapat digunakan untuk melakukan proses booting sistem operasi, dan hanya dapat menyimpan data pengguna. Jumlahnya tidak dibatasi, artinya dalam satu hard disk boleh terdapat banyak logical partition yang menginduk kepada satu buah partisi tambahan.

Membuat Partisi Harddisk

Membuat partisi hardisk memang merupakan salah satu hal yang sangat diperlukan untuk membagi harddisk yang mempunyai kapasitas besar. Idealnya dalam membagi partisi harddisk tersebut dibagi menjadi dua partisi yakni Primary Partisi (Driver C) dan Logical Partisi (Driver D) sehingga nantinya Anda dapat menetapkan dimana sistem operasi dan software aplikasi lainnya akan diinstall dalam sebuah drive tertentu. Membagi partisi akan sangat membantu Anda untuk melindungi file penting untuk menghindari kegagalan booting sistem operasi atau ketika ia terinfeksi oleh virus.

Baca selengkapnya »

Paket Kursus Pemrograman PHP dan MySQL

PHP adalah salah satu server side scripting (berjalan pada sisi server) yang populer saat ini. Selain dapat digunakan untuk berbagai sistem operasi, koneksi database yang sangat mudah, dan gratis menyebabkan PHP banyak digunakan. MySQL adalah salah satu jenis database server yang banyak digunakan dan sangat terkenal. Kepopulerannya disebabkan MySQL menggunakan SQL sebagai bahasa dasar untuk mengakses database yang terbagi menjadi tiga bagian, yaitu DDL, DML dan DCL. Selain itu, MySQL bersifat free (tidak perlu membayar untuk menggunakannya).

Dalam pelatihan ini peserta akan mempelajari bagaimana membangun aplikasi berbasis web dengan menggunakan PHP dan MySQL sebagai databasenya.

Materi Pelatihan

1. PHP Basics
2. Flow Control
3. Array
4. PHP & HTML Forms
5. String Manipulation
6. Functions
7. Database Fundamentals
8. Selecting Data
9. Subqueries, Joins & Unions
10. Inserting, Updating & Deleting Records
11. Managing Data With MySQL
12. Regular Expressions
13. Session Control
14. Sending E-Mail With PHP
15. Final Project: Membangun web berbasis PHP

Waktu

12 Sesi x @ 90 Menit

Biaya

1. Reguler Rp.400.000,- (3 orang)
2. Private Rp.750.000,-

Baca selengkapnya »