Balitechy.net button
Simple Phone Book #4 Menampilkan seluruh data kontak
Written by Eka Putra   
Friday, 30 October 2009 20:00

Setelah pada seri sebelumnya kita telah melakukkan berbagai persiapan dan konfigurasi terhadap CodeIgniter, sekarang kita akan mulai membuat Phone Book ini menampilkan seluruh data dari kontak dalam bentuk list atau daftar. Selanjutnya kita sebut saja List View.

LANGKAH 1 : MENGISI DATABASE DENGAN CONTOH DATA

Namun sebelum kita bisa menampilkan data yang ada di database, tentunya database kita harus ada isinya dahulu, untuk itu silahkan isi database anda dengan sembarangan data saja dahulu namun harus sesuai dengan typenya.

Dibawah ini saya akan mencoba mengisi databasenya dengan 4 buah data kontak yang fiktif tentunya :

 
INSERT INTO `phdata` (`id`, `name`, `phone`, `address`, `additional_desc`) VALUES
('', 'Agus', '0361 568 985', 'Gianyar, Bali', 'Web Designer'),
('', 'Budi', '021 958 5589', 'DKI Jakarta', 'System Programmer'),
('', 'Made Gede', '0361 589 4786', 'Denpasar, bali', 'Service Komputer panggilan'),
('', 'Putu Putra', '0361 310 6985', 'Ubud, Bali', 'Cuma contoh doank..');

Setelah database kita terisi dengan data kontak, sekarang saatnya kita membuat fasilitas List View di aplikasi Phone Book kita.

LANGKAH 2 : MEMBUAT MODEL

Seperti yang kita sudah ketahui, bahwa aplikasi ini hanya memerlukan sebuah file pada direktori models yang kita beri nama phone_model.php.

Langsung saja buat file phone_model.php pada direktori system/application/models, dan isi dengan baris kode berikut ini :
 
<?php
class Phone_model extends Model{
    function Phone_model(){
    parent::Model();
    }
 
    function get_all()
    {
    $query = $this->db->query('select * from phdata order by id');
    return $query->result();
    }
}
?>


Pada phone_model.php diatas pada intinya kita membuat sebuah class baru yang merupakan perpanjangan dari class Model yang ditandai dengan keyword Extends.

Didalamnya kita membuat dua buah function yaitu Phone_model dan get_all, Phone_model berfungsi sebagai class constructor sedangkan get_all berfungsi untuk mengambil data yang ada pada database supaya siap di berikan ke Controller.

LANGKAH 3 : MEMBUAT CONTROLLER

Ok, sekarang buatlah file phone.php pada direktori system/application/controllers, dan isi dengan baris kode di bawah ini:
 
<?php
class Phone extends Controller{
 
    function Phone(){
    parent::Controller();
    $this->load->model('phone_model');
    $this->load->helper('url');
    $this->load->helper('form');
    }
 
    function index(){
    $this->show_all();
    }
 
    function show_all(){
    $data['querys']=$this->phone_model->get_all();
    $this->load->view('showall',$data);
    }
}
?>


Pada phone.php diatas, dimana merupakan sebuah controller yang berfungsi untuk mengatur logika jalannya aplikasi kita.

Di dalamnya kita membuat sebuah Class yang bernama Phone. Di dalam Class Phone ini kita membuat tiga buah Function yaitu Phone, index dan show_all.

Function Phone berfungsi sebagai constructor Class sekaligus tempat kita mendeklarasikan Model, Helper ataupun Library yang akan selalu di panggil ketika Controller Phone ini berjalan. Untuk sintak pemanggilan dan nama-nama parameternya silahkan baca pada user guidenya CodeIgniter.

Namun yang perlu dicatat, pada Function Phone diatas kita juga memanggil Model yang barusan kita buat yaitu phone_model, hal ini harus supaya kita dapat mempergunakan fungsi-fungsi di dalamnya.

Function index merupakan sebuah fungsi yang secara default akan dijalankan ketika kita memanggil controller. Seperti diatas, pada function Index saya mengarahkan supaya pada saat controller ini dipanggil maka CodeIgniter akan langsung menjalankan fungsi show_all.

Function show_all disini berfungsi untuk mengambil data yang sudah disiapkan oleh phone_model dengan function get_all nya dan memberikannya kepada Views showall(sebentar lagi akan kita buat).

LANGKAH 4 : MEMBUAT VIEWS

Sekarang kita akan membuat sebuah View, dimana bertugas menampilkan data-data kontak kita ke browser kita berinama showall.

Langsung saja buat file showall.php pada direktori system/application/views, dan isi dengan kode berikut ini :
 
<html>
<head>
<title>Web Phone Book 1.0 by Pande Putu Eka Putra</title>
</head>
<body>
<h1>Contact Listing:</h1>
<table cellpadding="5" cellspacing="1" border="1">
<tr>
<th>ID</th><th>Name</th><th>Phone Number</th><th>Address</th><th>Additional Descriptions</th><th>Action</th>
</tr>
<?php foreach($querys as $rows){?>
<tr>
<td><?php echo $rows->id;?></td>
<td><?php echo $rows->name;?></td>
<td><?php echo $rows->phone;?></td>
<td><?php echo $rows->address;?></td>
<td><?php echo $rows->additional_desc;?></td>
</tr>
<?php }?>
</table>
</body>
</html>


Di dalam showall.php diatas pada intinya terdapat sebuah Loop yang berfungsi untuk membaca baris-demi baris data kontak yang dilewatkan Controller kepada View Showall ini.

LANGKAH 5 : TESTING… TESTING..

Setelah semua file diatas siap, maka sekarang saatnya kita menguji apakah fasilitas list view ini dapat berjalan sesuai dengan yang kita harapkan.

Pada address bar di web browser anda ketikkan http://localhost/phbook, dan lihat apa yang terjadi.

Dan UPSS… yang terjadi malah muncul pesan seperti ini :

404 Page Not Found
The page you requested was not found.


Apakah gerangan yang terjadi?, hal ini terjadi karena saat terakhir kali kita menghapus file welcome.php pada direktori Controllers kita juga lupa merubah setingan pada file routes.php pada direktori system/application/config.

File routes.php ini berfungsi untuk menentukan controller mana yang akan dijalankan secara default ketika kita hanya mengetikkan base url saja pada address bar. Jadi seharusnya yang dijalankan secara default adalah Controller Phone (phone.php) kita, namun pada kenyataannya yang dijalankan CodeIgniter adalah Controller Welcome (welcome.php), dan tentu saja CodeIgniter tidak menemukannya karena kita sudah mengapusnya.

Untuk mengatasi hal ini, langsung saja buka routes.php pada direktori system/application/config dan ganti baris ini :
 
$route['default_controller'] = "welcome";


Dan gantilah dengan menjadi seperti ini :
 
$route['default_controller'] = "phone";


Setelah itu simpan kembali routes.php, dan untuk mencobanya silahkan refresh web browser anda maka hasilnya akan seperti ini :

Halaman utama Simple Phonebook

Dari screenshot di atas anda akan melihat semua data yang sudah kita isi sebelumnya akan tampil, namun hasil ini pastinya tidak akan sama persis dengan anda, anda bisa lihat pada bagian ID nya, disana mulai dengan angka 13 sedangkan anda mungkin mulai dengan angka 1. Namun itu tidaklah menjadi masalah.

Selesai sudah fasilitas List View pada aplikasi Simple Phone Book kita, pada seri-seri berikutnya kita akan membuat fasilitas lainnya. Mulai dari Add Contact, Edit Contact, Delete Contact dan Personal View. Namun jangan takut dulu dengan namanya, karena dengan CodeIgniter semuanya itu dapat kita buat dengan langkah yang sederhana saja.

Comments (18)
  • tempe  - siiipp
    avatar
    wah gara2x baca artikel ini jadi tertarik nih mauh coba lebih lanjut
    :D
  • buah apel  - hmm
    avatar
    kok hsl yg mncul id?> trs name?> dstrsny..
    tp baris sesuai jmlh data, mhn pencerahanny
  • Eka Putra  - Php Short tag
    avatar
    Kalau hasilnya memang seperti itu kemungkinan anda ada kesalahan pada penulisan sintak php/html nya, silahkan di cek lagi.

    kemungkinan lainnya karena settingan PHP anda tidak mengijinkan digunakannya PHP SHORT OPEN TAG, dimana anda tidak akan bisa menggunakan sintak seperti , untuk amannya gunakan saja sintak php seperti biasanya .
  • joe  - huhh
    avatar
    mau tanya:
    kl
  • mike
    avatar
    database ini perlu di isi di mana?haruskah create another file dan savenya di mana?ngak faham tentang database.sudah running semuanya tapi keluarnya A Database Error Occurred
    Unable to select the specified database: phbook~ ngapa?




    INSERT INTO `phdata` (`id`, `name`, `phone`, `address`, `additional_desc`) VALUES
    ('', 'Agus', '0361 568 985', 'Gianyar, Bali', 'Web Designer'),
    ('', 'Budi', '021 958 5589', 'DKI Jakarta', 'System Programmer'),
    ('', 'Made Gede', '0361 589 4786', 'Denpasar, bali', 'Service Komputer panggilan'),
    ('', 'Putu Putra', '0361 310 6985', 'Ubud, Bali', 'Cuma contoh doank..');

    CREATE DATABASE 'phbook' DEFAULT CHARACTER SET latin1 COLLATE latin1_general_ci;
    USE 'phbook';
    CREATE TABLE IF NOT EXISTS 'phdata' (
    'id' int(11) NOT NULL AUTO_INCREMENT,
    'name' varchar(255) NOT NULL,
    'phone' varchar(150) NOT NULL,
    'address' varchar(255) DEFAULT NULL,
    'additional_desc' varchar(255) DEFAULT NULL,
    PRIMARY KEY ('id')
    ) ENGINE=MyISAM DEFAULT CHARSET=latin1 AUTO_INCRE...
  • Eka Putra
    avatar
    @mike
    kode diatas merupakan perintah2 sql yang dapat anda jalankan pada console mysql, atau lebih gampangnya lagi anda bisa gunakan PHPMYADMIN untuk membantu pembuatan database seperti diatas dengan sangat mudah. silahkan download di http://www.phpmyadmin.net/.

    Kalau anda belum begitu paham tentang database, silahkan anda googling tentang tutorial database.Tidak perlu terlalu ahli, yang penting anda mengerti sintak2 dasarnya saja terlebih dahulu.

    Pada saat menjalankan CI, kalau ada error seperti itu,maka sudah pasti karena anda belum membuat databasenya, atau nama database yang salah atau MYSQL server anda belum aktif.
  • mike
    avatar
    code itu mahu di paste di mana?mahu dibuat file seperti di file phone.php kah?kedua² code itu maksud saya.code sql itu perlu di save di mana maksud saya jika mahu database itu mengikut CI
  • Anonymous  - re:
    avatar
    mike wrote:
    code itu mahu di paste di mana?mahu dibuat file seperti di file phone.php kah?kedua² code itu maksud saya.code sql itu perlu di save di mana maksud saya jika mahu database itu mengikut CI


    Seperti yang saya jelaskan diatas, kode tersebut bisa anda copy dan paste di PHPMYADMIN. Apakah anda sudah punya PHPMYADMIN di komputer anda?

    nanti kalau sempat akan saya postingkan source code beserta databasenya untuk proyek sederhana ini.
  • mike
    avatar
    okok....sudah setting tp coding utk setting databasenya error....coding yang ada bagi itu ada error~
  • mike
    avatar
    id?> name?> phone?> address?> additional_desc?> keluarnya begini apabila sudah di insert into database??
  • mike
    avatar
    knp view macam di atas.apa yang salahnya source code untuk view?macam code anda salah untuk view dan untuk controllersnya..
  • Eka  - re:
    avatar
    mike wrote:
    knp view macam di atas.apa yang salahnya source code untuk view?macam code anda salah untuk view dan untuk controllersnya..


    Kalau hasilnya memang seperti itu kemungkinan anda ada kesalahan pada penulisan sintak php/html nya, silahkan di cek lagi.

    kemungkinan lainnya karena settingan PHP anda tidak mengijinkan digunakannya PHP SHORT OPEN TAG, dimana anda tidak akan bisa menggunakan sintak seperti , untuk amannya gunakan saja sintak php seperti biasanya .

    kalau code
    Code:
    tidak bekerja, ganti pakai
    Code:

    pak.
  • mike
    avatar
    sudah di check pak.memangnya sama seperti di atas.controllernya,viewsnya dan modelnya.sama seperti contoh di atas pak. ngak dapat lihat apa² yang ditulisnya code ini di atas pak??

  • Eka Putra  - Update Code
    avatar
    Karena banyak yang mengeluhkan kode pada View diatas tidak bekerja, yang sepertinya dikarenakan settingan php pada pembaca yang berbeda-beda( tidak mendukung SHORT OPEN TAG, maka saya update kodenya pada kode VIEW dengan sintak PHP biasa.

    semoga sekarang anda bisa lancar mencobanya.
Write comment
Your Contact Details:
Gravatar enabled
Comment:
[b] [i] [u] [url] [quote] [code] [img]   
:D:angry::angry-red::evil::idea::love::x:no-comments::ooo::pirate::?::(
:sleep::););)):0
Security
Please input the anti-spam code that you can read in the image.
 

SHARE IT

Add to: Digg Add to: Del.icoi.us Add to: Reddit Add to: StumbleUpon Add to: Yahoo Add to: Technorati Information
by: Camp26.Com

PARTNER

MAU BELI BUKU ONLINE?


Masukkan Code ini K1-79Y2D4-F
untuk berbelanja di KutuKutuBuku.com

PARTNER