Membuat Tampilan Data per-Halaman/Paging dengan Class Pagination Pada Codeigniter

Nugroho Ardi Sutrisno 20 Oktober 2016

Membuat Tampilan Data per-Halaman/Paging dengan Class Pagination Pada Codeigniter

Pernakah anda melakukan pencarian di mesin pencari seperti google dan mendapatkan hasil pencarian dengan jumlah ribuan bahkan jutaan? Dan tentu saja hasil dari pencarian tersebut tidak mungkin dapat di tampilkan semua dalam satu halaman melainkan dibagi dalam beberapa halaman dalam web yang sama. Metode menampilkan data seperti itulah yang disebut paging. Seperti pada google yang menampilkan beberapa hasil pencariannya diikuti daftar halaman seperti dibawah ini :

paginggoogle

Codeigniter memberikan fasilitas serupa yang dikenal dengan nama class pagination. Sebelum mempelajari pagination sebelumnya kita harus memahami tantang dasar dari codeigniter seperti konsep MVC dan operasi database sederhana dalam CodeIgniter.

  1. XAMPP, dengan Apache sebagai web server dan MySQL sebagai mesin database yang akan kita gunakan.
  2. Codeigniter 3.x sebagai web framework. Ekstrak hasil unduhan codeigniter salin ke folder xampp\htdocs dan beri nama belajar_ci.
  3. Bootstrap 3.x untuk mempercantik tampilan halaman web nanti. Pindah folder boostrap ke folder utama codeigniter belajar_ci dan ubah namanya menjadi assets, pastikan folder bootstrap tersebut hanya terdiri dari folder css, fonts, dan js beserta isinya, jika anda mengunduh seluruh source code bootstrap salin folder dist dalam folder bootstrap ke folder utama codeigniter belajar_ci dan ubah namanya menjadi assets.

Persiapan Database

Buat database baru di MySQL dengan nama kontak, Berikut sintaksnya:

Buat tabel baru dengan nama telepon, dengan kolom id, nama, dan nomor. Berikut sintaksnya:

Masukan beberapa record pada tabel telepon. Berikut sintaksnya:

Selanjutnya buka file database.php pada folder belajar_ci\application\config lalu setting sesuai konfigurasi berikut:

Controller

Buat file cotroler baru di folder belajar_ci\application\controller dengan nama kontak.php. Masukkan sintaks berikut:

Pada umumnya ada tiga bagian pada controller tersebut. Pertama pada function_construct terdapat bagian konfigurasi helper dan library yang dibutuhakan yaitu helper url dan library pagination dan database. Pada function index() terdapat konfigurasi class pagination yang berisi antara lain :

  1. $config['base_url']=base_url()."index.php/kontak/index"; Merupakan alamat url menuju class/fundtion pada controler yang berisi pagination. Pada contoh diatas ditujukan kepada controller kontak pada fungsi index.
  2. $config['total_rows']= $this->db->query("SELECT * FROM telepon;")->num_rows(); Untuk mengambil jumlah row yang akan ditampilkan.
  3. $config['per_page']=3; Untuk mengatur jumlah data yang akan ditampilkan per halaman.
  4. $config['num_links'] = 2; Jumlah “digit” link sebelum dan setelah nomor halaman yang dipilih. Sebagai contoh, nomor 2 akan menempatkan dua digit di kedua sisi.
  5. $config['uri_segment']=3; Digunakan untuk mendapatakan nomor halaman dari URL yang ditampilkan misalkan http://localhost/belajar_ci/index.php/index/4
  6. $config['first_link']='< Pertama '; Digunakan untuk kustomisasi nama halaman pertama, jika tidak ingin menampilkan ini masukkan FALSE sebagai nilainya.
  7. $config['last_link']='Terakhir > '; Digunakan untuk kustomisasi nama halaman terakhir, jika tidak ingin menampilkan ini masukkan FALSE sebagai nilainya
  8. $config['next_link']='> '; Teks yang akan diditampilkan sebagai link halaman berikutnya. Jika tidak ingin menampilkan ini masukkan FALSE sebagai nilainya.
  9. $config['prev_link']='< '; Teks yang akan diditampilkan sebagai link halaman sebelumnya. Jika tidak ingin menampilkan ini masukkan FALSE sebagai nilainya.

Model

Buat file model  baru di folder belajar_ci\application\model dengan nama m_kontak.php.  Masukkan sintaks berikut:

Pada class m_model terdapat function untuk mengambil semua data pada tabel seperti biasa namun terdapat beberapa perubahan seperti dibutuhkannya array $config yang berisi konfigurasi pagination yang nantinya akan mengambil data sejumlah data yang diperlukan per halaman.

View

Buat file view  baru di folder belajar_ci\application\view dengan nama v_kontak.php.  Masukan sintaks berikut :

Pada file v_kontak terdapat echo $this->pagination->create_links(); yang berfungsi untuk menampilkan daftar halaman yang telah dibuat.

Buka browser lalu masukan alamat http://localhost/belajar_ci/index.php/kontak/ maka akan tampil halaman yang telah dibuat seperti halaman berikut :

1

Styling

Untuk mempercantik tampilan halaman tersebut kita dapat menggunakan style bootstrap, ubah controller kontak menjadi :

Dan ubah view kontak (v_kontak.php) menjadi :

Maka tampilan halaman akan berubah menjadi :

2

Demikian cara menampilkan data dari database ke dalam halaman-halaman dengan menggunakan class pagination dari Codeigniter. Semoga bermanfaat.