Tutorial Menampilkan Data dari Database dengan Code Igniter untuk Pemula (CRUD bagian 1)

Kebutuhan :

  • Web Server, saya pakai wamp
  • Paket CI versi 1.7.X
  • Text Editor

Untuk menampilkan data dari database menggunakan framework code igniter, ikuti langkah berikut ini.

  1. Buat Database dengan nama “db_mahasiswa”, dan buat table dengan nama “tb_mahasiswa”. Tambahkan field id, nim, nama, alamat, email seperti
    Desain database

    Desain database

    Atau copi Sintax SQL berikut

    CREATE TABLE `db_mahasiswa`.`tb_mahasiswa` (`id` INT( 11 ) NOT NULL AUTO_INCREMENT PRIMARY KEY ,
    `nim` VARCHAR( 8 ) NOT NULL ,`nama` VARCHAR( 50 ) NOT NULL ,`alamat` VARCHAR( 100 ) NOT NULL ,
    `email` VARCHAR( 100 ) NOT NULL) ENGINE = MYISAM ;
    

    Untuk dummy datanya

    INSERT INTO `db_mahasiswa`.`tb_mahasiswa` (`id`, `nim`, `nama`, `alamat`, `email`)
    VALUES (NULL, 'M0507046', 'Titik Musyarofah', 'Kulon Progo, DIY', 'rove_titillate@yahoo.co.id'),
    (NULL, 'M0507060', 'Lena Astuti', 'Jebres, Surakarta', 'lei@gmail.com'),
    (NULL, 'M0507001', 'Andi Kurnia', 'Sleman, DIY', 'aan@gmail.com'),
    (NULL, 'M0507030', 'Abdulrahman Hafidz', 'Jakarta Timur', 'hafidz@yahoo.com');
    
  2. Download paket CI di codeigniter. Copikan folder CodeIgniter, taruh di localhost Anda. Disini saya ubah nama foldernya menjadi mycodeigniter.
  3. Setting database dengan membuka file database.php di folder mycodeigniter/system/application/config
    $db['default']['hostname'] = 'localhost';
    $db['default']['username'] = 'isikan username';
    $db['default']['password'] = 'isikan password';;
    $db['default']['database'] = 'db_mahasiswa';
    
  4. Setting config dengan membuka file config.php di folder mycodeigniter/system/application/config. Ganti base_url menjadi
    $config['base_url'] = 'http://localhost/mycodeigniter';
    
  5. Setting autoload dengan membuka file autoload.php difolder mycodeigniter/system/application/config. Isi librabry dengan ‘database”
    $autoload['libraries'] = array('database');
    
  6. Buat controller dengan nama “con_mahasiswa” di folder system/application/controllers
    <?php
    Class Con_mahasiswa extends CI_Controller { 
     function con_mahasiswa() {
     parent::controller();
     $this->load->model('mod_mahasiswa');
     $this->load->helper('url');
     }
     
     function index() {
     $data['hasil'] = $this->mod_mahasiswa->getall();
     $this->load->view('view_mahasiswa', $data);
     }
    }
    ?>
    
  7. Buat model dengan nama “mod_mahasiswa”, save di folder system/application/models
    <?php class Mod_mahasiswa extends Model { 
     function getall() { 
     $ambildata = $this->db->get('tb_mahasiswa');
     //jika data ada (lebih dari 0)
     if ($ambildata->num_rows() > 0 ) {
     foreach ($ambildata->result() as $data) {
     $hasil[] = $data;
     }
     return $hasil;
     }
     }
    }
    
  8. Untuk menampilkan hasilnya, buat file view di folder system/application/views dan simpn dengan nama view_mahasiswa.
    <?php
    if (empty($hasil)) {
     echo "Tidak ada data mahasiswa";
    }
    else {
    ?>
    <h3> Daftar Mahasiswa </h3>
    <?php echo anchor('con_mahasiswa/tambahdata', '+ Tambah Data'); ?>
    <table>
    <tr bgcolor="FF8844">
     <th> No </th>
     <th> Nim </th>
     <th> Nama </th>
     <th> Alamat </th>
     <th> Email </th>
    </tr>
    <?php
    $no = 1;
    foreach ($hasil as $data):
    ?>
    <tr>
     <td> <?php echo $no; ?> </td>
     <td> <?php echo $data->nim; ?> </td>
     <td> <?php echo $data->nama; ?> </td>
     <td> <?php echo $data->alamat; ?> </td>
     <td> <?php echo $data->email; ?> </td>
    </tr>
    <?php
    $no++;
    endforeach;
    ?>
    </table>
    <?php
    }
    ?>
    
  9. Coba akses di http://localhost/mycodeigniter/index.php/con_mahasiswa. Hasilnya
    Menampilkan Data dengan Code Igniter

    Menampilkan Data dengan Code Igniter

    Untuk menghilangkan tulisan index.php di url tersebut, akan saya jelaskan pada tutorial selanjutnya Cara Menghilangkan / Menghapus index.php di URL Code Igniter.

13 comments
  1. aston said:

    kok muncul pesan 404 Page Not Found,padahal udah sesuai ama tutorial?

  2. Tixtux said:

    berarti linknya ga ada, bisa jadi salah menulis link atau base url…

  3. Thanks sob artikelnya bermanfaat, silahkan di cek sob aplikasi akunting buatan anak Indonesia yang gak kalah keren ama buatan luar di kiper.co.id

  4. sendi said:

    Fatal error: Class ‘Controller’ not found in C:\xampp\htdocs\mydatabase\application\controllers\con_sriwedari.php on line 2

    • Tixtux said:

      Untuk versi Code Igniter memang ada sedikit yang berbeda dari penulisannya.

      Kalau not found, pada baris ke-2 file controller
      Class Con_mahasiswa extends Controller {

      ubah menjadi
      Class Con_mahasiswa extends CI_Controller {

    • Tixtux said:

      km pakai CI versi 2 ya? Yang tutorialku masih versi 1.7, versi lama, jadi codenya perlu diubah sedikit…

  5. Tixtux said:

    Kalau untuk kasus km
    Class Con_sriwedari extends CI_Controller {

    Begitupula untuk file modelnya ubah menjadi

    Class Mod_sriwedari extends CI_Model {

  6. Didin said:

    Fatal error: Call to undefined method CI_Controller::controller() in C:\xampp\htdocs\coba\application\controllers\con_mahasiswa.php on line 4

    Pada baris: parent::controller();

    • agung said:

      Fatal error: Call to undefined method CI_Controller::controller() in C:\xampp\htdocs\coba\application\controllers\con_mahasiswa.php on line 4

      • agung said:

        coba line 3 dan 4 diganti dengan script ini:
        function __construct(){
        parent::__construct();

  7. agung said:

    coba line no 3 dan 4 diganti dengan script ini :
    function __construct(){
    parent::__construct();

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: