Tutorial Memakai dan Menampilkan Flexigrid Menggunakan CodeIgniter

5:57 AM

Dalam post saya kali ini saya ingin sedikit berbagi pengalaman mengenai penggunaan flexigrid dengan Framework PHP CodeIgniter. Bagi yang belum tau tentang flexigrid mungkin bisa lihat-lihat dan berkenalan dulu di websitenya (http://www.flexigrid.info). Lebih spesifik lagi dalam tulisan saya ini ingin berbagi tentang bagaimana cara memakai dan menampilkan flexigrid di CodeIgniter. Pada awalnya saya sempat frustasi karena flexigrid yang sudah saya buat berdasarkan sumber tutorial di internet tenyata tidak muncul di tampilan web, tapi dengan sedikit usaha dan semangat pantang menyerah akhirnya bisa muncul juga. Hehe. Oke langsung saja inilah langkah-langkah yang saya lakukan untuk menampilkan flexigrid :

Instalasi Software Bundle XAMPP

Dengan software bundle XAMPP ini, kita bisa mendapatkan kemudahan yaitu kita langsung mendapatkan paket web server Apache, PHP, dan MySQL Database hanya dalam sekali install. Jika di PC Anda sudah terinstall web server Apache, PHP, dan MySQL Anda dapat mengabaikan langkah ini. Perlu diketahui bahwa kita bisa menginstall web server Apache, PHP, dan MySQL secara terpisah tanpa harus menginstall XAMPP.

Download software XAMPP disini dan setelah itu langsung diinstall. Saya rasa untuk menginstall XAMPP sangat mudah, tinggal klik next next.

Setelah XAMMP sukses terinstall coba ketikkan http://localhost pada browser anda untuk memastikan web server anda bekerja dengan baik. Web server yang bekerja dengan baik akan menampilkan tampilan seperti ini.

Selanjutnya buka folder htdocs di dalam direktori instalasi XAMPP. Buat folder baru dengan nama ci_flexigrid. Folder ini akan kita buat untuk menampung semua file-file penting yang akan kita butuhkan.

Instalasi Framework CodeIgniter

Download framework CodeIgniter di sini. Kemudian Ekstrak dan copy file yang ada di dalam folder CodeIgniter ke folder ci_flexigrid yang sudah kita buat tadi. Kita bisa menghapus folder user guide karena tidak terlalu kita butuhkan.

Kita perlu mengetahui apakah instalasi framework CodeIgniter kita berhasil atau tidak dengan mengetikkan alamat ini pada browser http://localhost/ci_flexigrid jika berhasil Anda akan melihat tampilan seperti ini.

Instalasi paket flexigrid untuk CodeIgniter

Download file paketnya di sini. Sebagai contoh untuk mengisi tabel flexigrid kita nanti di dalam paket ini sudah disediakan file database yaitu country.sql. Untuk memasukkannya pertama kita perlu membuat database baru di http://localhost/phpmyadmin dengan nama test_db (nama boleh sembarang)

Import file countries.sql yang ada pada paket sehingga akan menghasilkan tabel baru country beserta isinya.

Buka file database.php yang terdapat di dalam folder ci_flexigrid/application/config dan ubah username MySQL dan nama database sesuai dengan yang sudah kita buat sebelumnya. Username default pada MySQL adalah root sedangkan untuk password nya adalah kosong.

Didalam paket flexigrid yang telah kita download sebelumnya, terdapat folder application dan public. Pindahkan atau salinkan folder public ke folder ci_flexigrid/application begitu juga dengan file yang ada di dalam folder config, controllers, helpers, libraries, models, dan views yang ada di folder application ke folder ci_flexigrid/application sesuai dengan nama folder-nya masing-masing, misalkan file yang ada di folder config harus dipindah ke folder ci_flexigrid/application/config dan seterusnya untuk file-file yang lain.

Selanjutnya kita butuh sedikit menambahkan nilai string pada autoload helper dan libraries di autoload.php. Buka file autoload.php yang ada di direktori application/config dan tambahkan string url pada array helper dan string database pada array libraries.

mengubah pengaturan base_url di file config.php. Buka file config.php yang ada di direktori application/config. Isikan nilai string base_url dengan http://localhost/ci_flexigrid/

Nah, sekarang kita tinggal melakukan pengujian apakah paket flexigrid yang sudah kita install berhasil tampil atau tidak di browser dengan cara mengetikkan alamat ini di browser. http://localhost/ci_flexigrid/index.php/flexigrid/demo. Jika berhasil maka akan seperti ini jadinya,