crud sederhana

CI Tuts #3 – CRUD Sederhana Modul by: @toharyan

1

CI Tuts #3 – CRUD Sederhana

Setup Awal

Siapkan source code CodeIgniter di localhost. Apabila masih bingung gimana caranya, silakan

baca terlebih dahulu modul [CI Tuts #2 - Program Pertama dengan Codeigniter]

Buat database dengan nama ‘codeigniter’

Buat tabel dengan nama ‘mahasiswa’

Pada tabel ‘mahasiswa’, buat field berikut

Nama Field Tipe Field

id INT(11) AUTO INCREMENT PRIMARY

nim VARCHAR(8)

nama VARCHAR(50)

Catatan: nama database, nama tabel dan nama field huruf kecil semua

Buka file codeigniter/application/config/database.php lalu edit baris berikut: $db['default']['hostname'] = 'localhost';

$db['default']['username'] = 'root';

$db['default']['password'] = '';

$db['default']['database'] = 'codeigniter';

Catatan: username dan password sesuaikan dengan setting mysql pada saat pertama instal xampp. Secara default

setting untuk XAMPP seperti di atas.

Dalam modul ini kita akan belajar cara menampilkan data dari database ke browser, menambahkan

data, mengedit data dan menghapus data. File yang terlibat dalam modul ini diantaranya adalah:

application

|-- config

|-- autoload.php

|-- database.php

|-- controllers

|-- mahasiswa.php

|-- models

|-- mahasiswa_m.php

|-- views

|-- mahasiswa

|-- list.php

|-- detail.php

|-- form_tambah.php

|-- form_edit.php

Kita lihat, ada 8 file yang terlibat dalam program yang akan kita buat, 6 diantaranya kita buat sendiri.

File yang harus dibuat diantaranya adalah satu file controller bernama mahasiswa.php, satu file model

bernama mahasiswa_m.php, dan 4 file view yang disimpan di dalam subfolder bernama mahasiswa.


2

Menampilkan Daftar Data

Untuk pertama kali kita akan mencoba memanggil data dari database dan menampilkannya di dalam

aplikasi kita. Coba isikan beberapa data menggunakan phpMyAdmin. Berikut data yang saya isikan ke

dalam tabel mahasiswa:

id nim nama

[kosongkan] 0808538 Toni Haryanto

[kosongkan] 0907018 Andiyangita Widiagani

Codeigniter telah menyediakan library untuk memudahkan mengakses database. Untuk dapat

menggunakan library database, kita harus memuat terlebih dahulu library tersebut di dalam controller

atau model menggunakan sintaks $this->load->database();. Tapi supaya lebih sederhana, kita

akan memuat semua library dan helper standar di dalam file application/config/autoload.php. Buka

file tersebut kemudian edit beberapa baris berikut:

$autoload['libraries'] = array('database'); // baris 55

$autoload['helper'] = array('url'); // baris 67

Helper URL juga kita load di dalam file autoload. Helper ini berisi beberapa function yang sangat

membantu dalam memudahkan keperluan managemen URL.

Setelah itu buat sebuah file di dalam folder models/ dengan nama mahasiswa_m.php

models/mahasiswa_m.php <?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');

class Mahasiswa_m extends CI_Model {

/* get_all()

*

* fungsi ini mengambil semua data mahasiswa dari tabel

* mengembalikan satu atau beberapa data dalam bentuk objek

*

*/

public function get_all()

{

return $this->db->get('mahasiswa')->result();

}

}


3

Kemudian buat satu file di dalam folder controllers/ dengan nama mahasiswa.php

controllers/mahasiswa.php <?php if ( ! defined('BASEPATH')) exit('No direct script access allowed');

class Mahasiswa extends CI_Controller {

function __construct()

{

parent::__construct();

// load class model mahasiswa_m

$this->load->model('mahasiswa_m');

}

/* index()

*

* fungsi default untuk controller

* dijalankan bila kita tidak menspesifikkan pemanggilan fungsi pada url

* fungsi ini menampilkan halaman daftar semua data mahasiswa

*

*/

public function index()

{

// ambil semua data mahasiswa

// lalu masukkan ke dalam index variabel $data

$data['mahasiswa'] = $this->mahasiswa_m->get_all();

// load view daftar mahasiswa

// dengan menyisipkan variabel $data

// untuk dipasang di dalam template view

$this->load->view('mahasiswa/list', $data);

}

Kita lihat disini fungsi index memanggil fungsi get_all() dari dalam model dan menyimpan hasilnya di

dalam variabel $data[‘mahasiswa’]. Variabel $data kemudian dimuat ke dalam view bernama list untuk

kemudian ditampilkan di layar browser. Untuk itu kita buat dahulu file list.php di dalam folder

views/mahasiswa/.

views/mahasiswa/list.php <html>

<body>

<h1>Daftar Mahasiswa</h1>

<table border="1">

<tr>

<th>No</th>

<th>NIM</th>


4

<th>Nama</th>

</tr>

<?php $i = 1; foreach ($mahasiswa as $value){ ?>

<tr>

<td><?php echo $i; ?></td>

<td><?php echo $value->nim; ?></td>

<td><?php echo $value->nama; ?></td>

</tr>

<?php $i++; }; ?>

</table>

</body>

</html>

Di dalam file view list.php kita memanggil variabel $mahasiswa yang tidak lain adalah representasi dari

indeks array $data[‘mahasiswa’] yang dimuat dari controller. Isi dari variabel $mahasiswa itu kita loop

menggunakan sintaks foreach() dan menampilkan data dari tiap baris data mahasiswa ke dalam baris di

dalam tabel.

Sekarang coba panggil dari browser http://localhost/codeigniter/mahasiswa/index. Bila tampilannya

seperti ini berarti Kamu berhasil mengambil data dari database dan menampilkannya ke browser. ;)

Setelah Kamu berhasil menampilkan data di atas, kita akan coba menampilkan data individual dari

setiap data. Kalo tadi kita menampilkan semua data di dalam sebuah tabel, sekarang kita hanya akan

menampilkan detail satu data yang kita pilih di dalam satu halaman.

Tambahkan satu fungsi di dalam class model mahasiswa_m di dalam file models/mahasiswa_m.php

untuk mengambil satu data berdasarkan field id.


5

models/mahasiswa_m.php /* get_by_id()

*

* fungsi ini mengambil data satu mahasiswa berdasarkan id

* mengembalikan satu baris data dalam bentuk objek

* parameter:

* $id id data mahasiswa pada tabel kolom id

*

*/

public function get_by_id($id)

{

$this->db->where('id', $id);

return $this->db->get('mahasiswa')->row();

}

Kemudian tambahkan satu fungsi di dalam class controller di dalam file controllers/mahasiswa.php

untuk menampilkan halaman detail data.

controllers/mahasiswa.php /* detail()

*

* fungsi ini menampilkan halaman detail data satu mahasiswa

* yang diacu oleh $id pada parameter

*

*/

public function detail($id = false)

{

// apabila fungsi ini dipanggil tanpa menyertakan parameter $id

// maka tampilkan halaman 404 Not Found

if(! $id) show_404();

// ambil satu data mahasiswa yang ber-id $id

// lalu simpan di dalam indeks pada variabel $data

$data['detail'] = $this->mahasiswa_m->get_by_id($id);

// load view detail mahasiswa


// untuk dipasang di dalam template view

$this->load->view('mahasiswa/detail', $data);

}

Fungsi detail di atas mengecek terlebih dahulu apakah parameter id diisi atau tidak. Kalo tidak diisi

maka kita tampilkan halaman error 404 Page not Found. Bila parameter $id diisi kita ambil satu data

mahasiswa menggunakan fungsi get_by_id() dari model, data mahasiswa yang ber-id $id. Data tersebut

kemudian disimpan di dalam variabel array $data[‘detail’] dan memuatnya ke dalam view

mahasiswa/detail untuk ditampilkan.


6

Berarti kita harus membuat file view detail.php di dalam folder views/mahasiswa/.

views/mahasiswa/detail.php <html>

<body>

<h1>Detail Data</h1>

<table border="1">

<tr>

<th>NIM</th>

<td><?php echo $detail->nim; ?></td>

</tr>

<tr>

<th>Nama</th>

<td><?php echo $detail->nama; ?></td>

</tr>

</table>

<hr>

<a href="<?php echo site_url('mahasiswa/index'); ?>">kembali</a>

</body>

</html>

Biar gampang manggil halaman detail untuk setiap datanya, kita akan membuat tautan untuk detail

setiap baris data. Buka file views/mahasiswa/list.php dan edit seperti kode yang dicetak tebal berwarna

oranye berikut.


<body>


<table border="1">

<tr>

<th>No</th>

<th>NIM</th>

<th>Nama</th>

<th></th>

</tr>


<tr>




<td>

<a href="<?php echo site_url('mahasiswa/detail/'.$value->id); ?>">

Detail</a>

</td>


7

</tr>

<?php $i++; }; ?>

</table>

</body>

</html>

Sekarang buka lagi halaman http://localhost/codeigniter/mahasiswa/index di browser dan mestinya

tampilannya sudah seperti ini.

Coba klik salahsatu tautan Detail. Bila kodenya benar, maka seharusnya halaman berubah dan tampil

seperti ini.

Congrats! Kamu sudah bisa menampilkan data dari database ke browser. :D


8

Menambahkan Data Baru

Di bagian sebelumnya kita sudah membuat fitur untuk menampilkan data dari database. Sekarang kita

akan membuat fitur tambah data. Kita akan membuat satu form yang bisa kita gunakan untuk

menambahkan baris data ke dalam database.

Pertama, buka file controllers/mahasiswa.php dan tambahkan dua fungsi berikut di dalam class

Mahasiswa.

controllers/mahasiswa.php /* form_tambah()

*

* fungsi ini menampilkan halaman form tambah mahasiswa

*

*/

public function form_tambah()

{

// load view form_tambah

$this->load->view('mahasiswa/form_tambah');

}

/* tambah()

*

* fungsi ini menangkap data mahasiswa yang dikirim via POST form

* untuk disimpan sebagai data baru pada tabel

*

*/

public function tambah()

{

// jika data post tidak ada

// maka tampilkan halaman 404 Page not Found

if(! $this->input->post()) show_404();

// tangkap data nim dan nama dari POST form

// lalu simpan ke indekx data dengan nama indeks

// yang sama dengan nama kolomnya

$data = array(

'nim' => $this->input->post('nim'),

'nama' => $this->input->post('nama')

);

// kirim $data ke model untuk disimpan di database

$this->mahasiswa_m->tambah($data);

// kembali ke halaman list mahasiswa

redirect('mahasiswa/index');

}


9

Fungsi form_tambah() gunanya untuk menampilkan form tambah. Sedangkan fungsi tambah() gunanya

untuk menangkap data yang disubmit dari form tambah.

Untuk fungsi form_tambah() kita memerlukan satu view untuk menampilkan form tambah data.

views/mahasiswa/form_tambah.php <html>

<body>

<h1>Tambah Data Mahasiswa</h1>

<form action="<?php echo site_url('mahasiswa/tambah'); ?>" method="POST">

<table>

<tr>

<td>NIM : </td>

<td><input type="text" size="8" name="nim"></td>

</tr>

<tr>

<td>Nama : </td>

<td><input type="text" size="20" name="nama"></td>

</tr>

<tr>

<td>

<button type="submit">Simpan Data</button>

</td>

</tr>

</table>

</form>

<hr>


</body>

</html>

Coba panggil dari browser http://localhost/codeigniter/mahasiswa/form_tambah. Form tambah data

mahasiswa mestinya muncul seperti ini.


10

Setelah fungsi tambah() dimasukkan juga ke controller Mahasiswa, kita masih harus menyiapkan satu

fungsi di model supaya datanya bisa disimpan ke database.

models/mahasiswa_m.php /* tambah()

*

* fungsi ini menyimpan data mahasiswa ke dalam tabel

* parameter:

* $data data yang akan disimpan, bentuknya array('namakolom'=>'nilai')

*

* mengembalikan data berupa int id mahasiswa yang baru disimpan

*

*/

public function tambah($data)

{

$this->db->insert('mahasiswa', $data);

return $this->db->insert_id();

}

Setelah ini mestinya kita sudah bisa submit data baru. Coba isi form tambah data tersebut kemudian

tekan tombol Simpan Data. Apabila berhasil, maka halaman akan dialihkan ke halaman daftar data

mahasiswa dengan penambahan data baru yang kita sudah masukkan.

Supaya gampang memanggil halaman form tambah data, kita tambahkan tautan untuk halaman

tersebut di file views/mahasiswa/list.php.


<body>


<div>

<a href="<?php echo site_url('mahasiswa/form_tambah'); ?>">

Tambah Data Mahasiswa</a>

</div>

<hr>

<table border="1">

<tr>

<th>No</th>

<th>NIM</th>

<th>Nama</th>

<th></th>

</tr>


<tr>


11




<td>


Detail</a>

</td>

</tr>

<?php $i++; }; ?>

</table>

</body>

</html>

Akan muncul tautan bertuliskan Tambah Data Mahasiswa di bawah judul yang bila diklik akan muncul

halaman form tambah data.

Mengedit Data Lama

Sekarang kita buat fitur untuk mengedit data yang sudah ada. Untuk itu, kita siapkan dulu tautan di

setiap baris data untuk menampilkan halaman form edit data. Tambahkan pada file

views/mahasiswa/list.php seperti kode yang dicetak tebal oranye di bawah ini.


<body>


<div>



</div>

<hr>

<table border="1">

<tr>

<th>No</th>

<th>NIM</th>

<th>Nama</th>

<th></th>

</tr>


<tr>





12

<td>


Detail</a>

<a href="<?php echo site_url('mahasiswa/form_edit/'.$value->id); ?>">

Edit</a>

</td>

</tr>

<?php $i++; }; ?>

</table>

</body>

</html>

Setelah itu, tambahkan dua fungsi berikut pada controller Mahasiswa.

controllers/mahasiswa.php /* form_edit()

*

* fungsi ini menampilkan form edit data

* untuk data mahasiswa ber-id $id

*

*/

public function form_edit($id = false)

{

// jika parameter $id tidak disertakan dalam pemanggilan halaman


if(! $id) show_404();

// ambil dulu data mahasiswa ber-id $id

// untuk dipasang di dalam form edit

$data['detail'] = $this->mahasiswa_m->get_by_id($id);

// load view form_edit


// untuk dipasang pada form edit

$this->load->view('mahasiswa/form_edit', $data);

}

/* edit()

*

* fungsi ini menangkap data mahasiswa yang dikirim via POST form

* untuk disimpan sebagai pembaharuan data mahasiswa ber-id $id

*

*/

public function edit()

{

// kalo data POST tidak ada


if(! $id = $this->input->post('id')) show_404();


13

// tangkap data nim dan nama dari POST form

// lalu simpan ke indeks data dengan nama indeks

// yang sama dengan nama kolomnya

$data = array(

'nim' => $this->input->post('nim'),

'nama' => $this->input->post('nama')

);

// kirim $id sebagai identitas data yang akan diupdate

// dan $data ke model untuk dperbaharui di database

$this->mahasiswa_m->update($id, $data);

// kembali ke halaman list mahasiswa


}

Ada dua fungsi yang ditambahkan, fungsi form_edit() dan fungsi edit(). Fungsi form_edit() digunakan

untuk menampilkan form edit data. Bedanya dengan form tambah data yang hanya menampilkan form

kosong, form edit ini menampilkan form beserta data yang sudah ada yang mau diedit. Itu berarti kita

harus mengambil dulu satu data dari database yang mau diedit berdasarkan id yang diset pada

parameter $id fungsi tersebut, kemudian memasangnya di dalam form edit data. Form edit datanya

seperti berikut.

views/mahasiswa/form_edit.php <html>

<body>

<h1>Edit Data Mahasiswa</h1>

<form action="<?php echo site_url('mahasiswa/edit/'.$detail->id); ?>"

method="POST">

<table>

<tr>

<td>NIM : </td>

<td><input type="text" size="8" name="nim"

value="<?php echo $detail->nim; ?>"></td>

</tr>

<tr>

<td>Nama : </td>

<td><input type="text" size="20" name="nama"

value="<?php echo $detail->nama; ?>"></td>

</tr>

<tr>

<td>

<input type="hidden" name="id" value="<?php echo $detail->id; ?>">

<button type="submit">Update Data</button>

</td>

</tr>

</table>

</form>


14

<hr>


</body>

</html>

Perhatikan pada form di atas, kita memasang data pada setiap fieldnya supaya ketika form edit ini

dipanggil, browser akan menampilkan form edit dengan field yang sudah terisi data yang terdahulu.

Perhatikan juga bahwa kita menambahkan <input type=”hidden”> untuk menyimpan nilai id data yang

sedang diedit. Field ini nantinya akan mengirimkan nilai id dan digunakan sebagai acuan data yang akan

diedit di database.

Setelah data yang disubmit ditangkap oleh fungsi edit() pada controller, fungsi ini akan menyimpan

pembaharuan data menggunakan fungsi update() yang ada pada model mahasiswa_m. Maka kita harus

menambahkan fungsi update() pada model seperti berikut.

models/mahasiswa_m.php /* update()

*

* fungsi ini memperbaharui data mahasiswa ber-id $id

* mengembalikan data berupa int banyaknya data yang berhasil diupdate

* parameter:

* $id id data mahasiswa pada tabel kolom id sebagai acuan data yang akan diupdate

* $data data yang akan diperbaharui, bentuknya array('namakolom'=>'nilai')

*

*/

public function update($id, $data)

{

$this->db->where('id', $id)

->update('mahasiswa', $data);

// kembalikan nilai banyaknya data yang terupdate

return $this->db->affected_rows();

}

Selesai. Sekarang klik salahsatu tautan Edit dari halaman daftar mahasiswa untuk menampilkan

halaman edit data yang dipilih. Setelah muncul form edit data, coba ganti nama atau nim pada form

lalu tekan tombol Update Data. Bila tidak ada masalah, browser akan mengalihkan ke halaman daftar

data mahasiswa dengan menampilkan data terbaru.

Sip. Tinggal satu fitur lagi, fitur yang paling gampang, hapus data. :)


15

Menghapus Data

Ini fitur yang paling gampang karena hanya memerlukan satu fungsi di controller dan satu fungsi di

model. Fungsi ini tidak berlaku sebagai halaman yang ditampilkan secara mandiri sehingga tidak

memerlukan file view.

Mekanisme penghapusan data adalah, controller menginstruksikan penghapusan data menggunakan id

sebagai patokan data yang dihapus, dengan memanggil fungsi pada model untuk menghapus data

berdasarkan id yang dimasukkan.

Kita siapkan dulu tautan untuk menghapus data pada setiap baris pada daftar data mahasiswa.


<body>


<div>



</div>

<hr>

<table border="1">

<tr>

<th>No</th>

<th>NIM</th>

<th>Nama</th>

<th></th>

</tr>


<tr>




<td>


Detail</a>

<a href="<?php echo site_url('mahasiswa/form_edit/'.$value->id); ?>">

Edit</a>

<a href="<?php echo site_url('mahasiswa/hapus/'.$value->id); ?>"

onclick="return confirm('Anda yakin akan menghapus data ini?')">

Hapus</a>

</td>

</tr>

<?php $i++; }; ?>

</table>


16

</body>

</html>

Hasil akhir tampilan daftar data mahasiswa setelah ditambah tautan hapus data menjadi seperti ini

Langkah terakhir adalah menambahkan fungsi hapus() pada controller dan model.

controllers/mahasiswa.php /* hapus()

*

* fungsi ini berfungsi menghapus data mahasiswa

* yang diacu oleh $id pada parameter

*

*/

public function hapus($id = false)

{

// apabila fungsi ini dipanggil tanpa menyertakan parameter $id

// maka tampilkan halaman 404 Not Found

if(! $id) show_404();

// hapus data mahasiswa ber-id $id

$this->mahasiswa_m->hapus($id);

// kembali ke halaman sebelumnya


}

models/mahasiswa_m.php /* hapus()

*

* fungsi ini menghapus data mahasiswa ber-id $id

* mengembalikan data berupa int banyaknya data yang berhasil dihapus

* parameter:


17

* $id id data mahasiswa pada tabel kolom id sebagai acuan data yang akan dihapus

*

*/

public function hapus($id)

{

$this->db->where('id', $id)

->delete('mahasiswa');

// kembalikan nilai banyaknya data yang terhapus

return $this->db->affected_rows();

}

Selesai sudah. Silakan dicek tautan hapusnya. Kalo berhasil maka baris data yang dihapus akan hilang

dari daftar. Selamat! Kamu sudah menyelesaikan modul tutorial CRUD sederhana menggunakan

CodeIgniter! Setelah ini kamu bisa membuat aplikasi apapun dengan CodeIgniter :D

crud sederhana

Documents