Tutorial Codeigniter 4 – Part 11 – Membuat Pagination di Codeigniter 4
Selamat Datang di tutorial warung belajar, dalam tutorial kali ini kita akan melanjutkan seri tutorial codeigniter 4, pada part 11 kita akan membahas mengenai cara membuat fitur pagination di codeigniter 4.
Fitur Pagination adalah fitur yang membuat aplikasi dapat menampilkan data dengan lebih cepat, karena kita melakukan pembatasan terhadap berapa jumlah data yang ditampilkan, sehingga aplikasi tidak perlu load seluruh data saat halaman halaman ditampilkan.
Sebagai contoh anda memiliki 1000 data pegawai, kalau tidak menggunakan fitur pagination maka setiap kali kita mengakses menu tampil pegawai akan menampilkan 1000 data pegawai, berbeda halnya saat kita menggunakan fitur pagination, kita bisa mengatur berapa jumlah data yang ditampilkan dalam sebuah halaman, semisal kita set hanya ada 10 data perhalaman, jadi ketika kita mengakses menu data pegawai hanya 10 data tersebut yang ditampilkan, ketika kita klik halaman berikutnya, baru akan menampilkan 10 data berikutnya, hal ini dapat mempercepat proses akses menu karena data yang ditampilkan kita batasi dengan fitur pagination.
Dalam Codeigniter 4 kita akan dipermudah saat proses pagination ini, dalam study kasus ini kita akan membuat tabel didatabase dengan nama pegawai, dimana kita akan generate 100 data dummy dengan library faker, lalu berikutnya kita akan gunakan fitur pagination untuk menampilkan datanya.
Baik langsung saja kita mulai ya, pembahasan terkait pagination di codeigniter 4, beberapa hal yang akan kita bahas adalah sebagai berikut :
- Instalasi Codeigniter 4
- Membuat Tabel pegawai dengan migration
- Koneksi Codeigniter 4 dengan Database
- Membuat Model
- Menampilkan data tanpa menggunakan pagination
- Setting Pagination
- Setting Custom Pagination
- Betulkan Penomeran di Pagination
Baik kita mulai ya, dari mulai proses Instalasi Codeigniter 4.
Video Tutorial Codeigniter 4 – Part 11 – Membuat Pagination di Codeigniter 4
Buat teman – teman yang biasanya belajar menggunakan Video, kita juga ada video tutorial membuat pagination di Codeigniter 4, bisa diakses melalui video dibawah
Instalasi Codeigniter 4
Untuk langkah awal kita perlu menginstall codeigniter 4 terlebih dahulu, dalam contoh ini kita install codeigniter 4 dalam folder dengan nama pegawai.
karena dalam contoh ini kita gunakan xampp, dan secara default untuk web direktori xampp berada di C:/xampp/htdocs, jadi silahkan masuk kedalam folder tersebut, melalui terminal, lalu berikutnya ketikkan perintah seperti gambar dibawah ini :
|
1 |
composer create-project codeigniter4/appstarter pegawai |
Sehingga gambar berikut ini :
lalu tekan enter, tunggu hingga proses instalasi selesai.. untuk mempelajari lebih lanjut terkait dengan cara menginstall Codeigniter 4 silahkan buka tutorial kita sebelumnya : Cara Menginstall Codeigniter 4
Membuat Migration
Berikutnya kita akan membuat bagian migration, karena nantinya kita akan buat tabel di database untuk menyimpan data pegawai, kita akan buat tabel didatabase dengan nama pegawai, baik langkah – langkah untuk proses pembuatan migration adalah sebagai berikut :
Silahkan buka terminal dan masuk kedalam direktori : C:\Xampp\htdocs\pegawai, lalu tuliskan perintah :
|
1 |
php spark migrate:create Pegawai |
Lalu tekan enter, akan terbuat sebuah file didalam folder app/Database/Migrations, nama file tersebut akan diakhiri dengan nama Pegawai
buka file tersebut, dan isi dengan code seperti berikut ini :
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 |
<?php namespace App\Database\Migrations; use CodeIgniter\Database\Migration; class Pegawai extends Migration { public function up() { $this->forge->addField([ 'id_pegawai' => [ 'type' => 'INT', 'constraint' => 11, 'unsigned' => true, 'auto_increment' => true, ], 'nama' => [ 'type' => 'VARCHAR', 'constraint' => '255', ], 'jenis_kelamin' => [ 'type' => 'ENUM', 'constraint' => "'pria','wanita'", ], 'no_telp' => [ 'type' => 'VARCHAR', 'constraint' => '100', ], 'email' => [ 'type' => 'VARCHAR', 'constraint' => '200', ], 'tanggal_lahir' => [ 'type' => 'DATE' ], 'alamat' => [ 'type' => 'VARCHAR', 'constraint' => '255', ], 'created_at' => [ 'type' => 'DATETIME', 'null' => true, ], 'updated_at' => [ 'type' => 'DATETIME', 'null' => true, ] ]); $this->forge->addPrimaryKey('id_pegawai'); $this->forge->createTable('pegawai'); } //-------------------------------------------------------------------- public function down() { $this->forge->dropTable('pegawai'); } } |
Keterangan :
Dalam kode diatas digunakan untuk generate tabel dengan nama pegawai, dengan kolom sebagai berikut :
- id_pegawai (INT) (AUTO INCREMENT) (PRIMARY KEY)
- nama (VARCHAR 255)
-
jenis_kelamin (ENUM(‘pria’,’wanita’))
-
no_telp (VARCHAR 100)
-
email (VARCHAR 200)
-
tanggal_lahir (DATE)
-
alamat (VARCHAR 255)
-
created_at (DATETIME)
-
updated_at (DATETIME)
Buat database di PHPMYADMIN
Berikutnya kita buat database dengan menggunakan PHPMYADMIN, silahkan buka alamat localhost/phpmyadmin
Lalu buat database baru, semisal kita beri nama dbpegawai, lalu klik tombol create..
Konfigurasi File Env
Berikutnya kita akan koneksikan codeigniter 4 dengan database, silahkan rename file dengan nama env menjadi .env
berikutnya buka file .env tersebut dan edit code didalamnya, untuk konfigurasi database berada pada line 52 – 56, hilangkan tanda # untuk mengaktifkan konfigurasi tersebut
|
1 2 3 4 5 |
database.default.hostname = localhost database.default.database = dbpegawai database.default.username = root database.default.password = database.default.DBDriver = MySQLi |
Keterangan :
- hostname isi dengan alamat server database
- database isi dengan nama database, dalam contoh ini adalah dbpegawai
- username isi dengan user database, dalam contoh ini gunakan root sebagai user database
- password biarkan kosong karena, default password xampp adalah kosong
Berikutnya silahkan jalankan file migration untuk generate tabel di database, dengan menggunakan perintah :
Tuliskan perintah php spark migrate, lalu tekan enter
Lalu coba buka database akan terbuat 2 tabel baru :
- Migrations
- Pegawai
Generate Dummy data dengan menggunakan Library Faker
Berikutnya kita akan insert dummy data kedalam tabel pegawai menggunakan library Faker, langkah – langkahnya adalah sebagai berikut :
Silahkan buat file seeder dengan nama Pegawai, dengan mengetikkan perintah berikut ini di terminal :
|
1 |
php spark make:seeder PegawaiSeeder |
Akan terbuat file baru dengan nama PegawaiSeeder didalam folder App\Database\Seeds
Lalu silahkan buka file PegawaiSeeder.php, lalu tambahkan kode seperti berikut ini :
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 |
<?php namespace App\Database\Seeds; use CodeIgniter\Database\Seeder; use CodeIgniter\I18n\Time; class PegawaiSeeder extends Seeder { public function run() { $faker = \Faker\Factory::create('id_ID'); for ($i = 0; $i < 100; $i++) { $jk = $faker->randomElement(['pria', 'wanita']); if ($jk == "pria") { $gender = "male"; } else { $gender = "female"; } $data = [ 'nama' => $faker->name($gender), 'jenis_kelamin' => $jk, 'no_telp' => $faker->phoneNumber, 'tanggal_lahir' => $faker->date('Y-m-d', 'now'), 'alamat' => $faker->address, 'email' => $faker->email, 'created_at' => Time::now() ]; $this->db->table('pegawai')->insert($data); } } } |
untuk penjelasan kode diatas terkait pembuatan dummy data dengan library faker, tidak akan saya jelas lebih detail disini, teman – teman bisa melihat pembahasan sebelumnya pada tutorial : Mengenal Migration, Seeding, dan Library Faker di Codeigniter 4
Setelah itu berikutnya kita akan jalankan file PegawaiSeeder itu agar generate data di dalam tabel pegawai di database.
Tuliskan perintah :
|
1 |
php spark db:seed PegawaiSeeder |
Jika perintah itu dijalankan, akan generate 100 data pegawai, ke dalam tabel pegawai, anda bisa cek di database dbpegawai yang sebelumnya telah kita buat.
Membuat Model untuk berkomunikasi dengan tabel Pegawai
Berikutnya kita akan membuat model, agar dapat berkomunikasi dengan tabel pegawai, silahkan buat model dengan nama PegawaiModel.php dan simpan dalam folder app/Models, dan untuk isi codenya adalah sebagai berikut ini :
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
<?php namespace App\Models; use CodeIgniter\Model; class PegawaiModel extends Model { protected $table = 'pegawai'; protected $primaryKey = 'id_pegawai'; protected $returnType = 'object'; protected $allowedFields = ['nama', 'jenis_kelamin', 'no_telp', 'email', 'tanggal_lahir', 'alamat']; protected $useTimestamps = true; } |
Keterangan :
- Protected $table = ‘pegawai’ kita buat agar model ini dapat terkoneksi dengan tabel pegawai
- Protected $primaryKey = ‘id_pegawai’ kita buat agar primary key adalah id_pegawai
- Protected $returnType = ‘object’ kita buat agar return tersebut adalah object
- Protected $allowedFields adalah kolom yang bisa diinsert dan update datanya
- Protected $useTimestamps memungkin kita menyimpan kapan data itu diinsert dan diupdate
Pembahasan ini bisa dilihat di tutorial kita sebelumnya yang membahas : Cara Membuat Model di Codeigniter 4
Membuat Controller Pegawai
Berikutnya kita akan membuat controller dengan nama pegawai, yang nantinya kita gunakan sebagai controller untuk menampilkan data pegawai, silahkan buat file dengan nama Pegawai.php dan simpan didalam folder app/Controllers
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
<?php namespace App\Controllers; use App\Models\PegawaiModel; class Pegawai extends BaseController { public function index() { $pegawai = new PegawaiModel(); $data['pegawai'] = $pegawai->findAll(); return view('vw_pegawai', $data); } } |
Keterangan :
- Kita load model dengan nama PegawaiModel (Line 5)
- Kita buat class dengan nama Pegawai sesuai dengan nama controller (Line 7)
- Didalam class pegawai kita buat method dengan nama index, di dalam method index kita buat object dengan nama pegawai dengan menggunakan class PegawaiModel,berikutnya kita akses seluruh data pegawai dengan menggunakan method findAll, dan simpan dalam array $data dengan key ‘pegawai’ (Line 12)
- Berikutnya kita akses view dengan vw_pegawai, dan kita passing variabel $data merupakan array yang berisi data pegawai (Line 13)
Membuat File view untuk menampilkan data pegawai
Berikutnya kita akan buat file view dengan nama vw_pegawai.php dan kita simpan didalam folder app/Views, untuk codenya adalah sebagai berikut :
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 |
<!doctype html> <html lang="en" class="h-100"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="description" content=""> <meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors"> <meta name="generator" content="Hugo 0.79.0"> <title>Sticky Footer Template · Bootstrap v5.0</title> <!-- Bootstrap core CSS --> <link href="https://getbootstrap.com/docs/5.0/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-giJF6kkoqNQ00vy+HMDP7azOuL0xtbfIcaT9wjKHr8RbDVddVHyTfAAsrekwKmP1" crossorigin="anonymous"> <style> .bd-placeholder-img { font-size: 1.125rem; text-anchor: middle; -webkit-user-select: none; -moz-user-select: none; user-select: none; } @media (min-width: 768px) { .bd-placeholder-img-lg { font-size: 3.5rem; } } </style> <!-- Custom styles for this template --> <link href="https://getbootstrap.com/docs/5.0/examples/sticky-footer/sticky-footer.css" rel="stylesheet"> </head> <body class="d-flex flex-column h-100"> <!-- Begin page content --> <main class="flex-shrink-0"> <div class="container-fluid"> <h1 class="mt-5">Data Pegawai</h1> <hr /> <table class="table table-hover table-bordered"> <thead> <tr class="table-primary"> <th>No</th> <th>Nama</th> <th>Jenis Kelamin</th> <th>No Telp</th> <th>Email</th> <th>Tanggal Lahir</th> <th>Alamat</th> </tr> </thead> <tbody> <?php $nomor = 1; foreach ($pegawai as $row) { ?> <tr> <td><?= $nomor++; ?></td> <td><?= $row->nama; ?></td> <td><?= $row->jenis_kelamin; ?></td> <td><?= $row->no_telp; ?></td> <td><?= $row->email; ?></td> <td><?= $row->tanggal_lahir; ?></td> <td><?= $row->alamat; ?></td> </tr> <?php } ?> </tbody> </table> </div> </main> <footer class="footer mt-auto py-3 bg-light"> <div class="container"> <span class="text-muted">Place sticky footer content here.</span> </div> </footer> </body> </html> |
Keterangan :
- Ini adalah tampilan dari bootstrap 5, saya sudah set sesederhana mungkin, dan karena library CSS dan javascript ini mengakses server langsung, sehingga untuk dapat tampilan maksimal pastikan teman – teman terkoneksi dengan internet.
- Skripnya memang agak panjang, tapi yang teman – teman fokuskan hanya di line 39 – 69.
- Kita buat tabel dengan menggunakan tag table html biasanya, kita set kolom dibagian tabel header pada line 40 – 50
- Untuk extract data dari tabel pegawai, perhatikan line 54 kita gunakan method foreach kita extract data untuk setiap perulangan akan diwakili dengan variabel $row, kita akan tampilkan datanya dengan menyebutkan nama kolom di tabel pegawai, perhatikan line 57 – 63
Lalu kita coba untuk mengaksesnya… silahkan buka terminal pada folder project dan jalankan local development server dengan perintah :
|
1 |
Php spark serve |
Lalu silahkan akses URL :
|
1 |
localhost:8080/pegawai |
Menambahkan Pagination dihalaman tampil pegawai
Berikutnya kita akan menambahkan bagian pagination dibagian pegawai, silahkan buka controller Pegawai.php didalam folder app/Controllers, lalu ubah codenya menjadi sebagai berikut :
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
<?php namespace App\Controllers; use App\Models\PegawaiModel; class Pegawai extends BaseController { public function index() { $pegawai = new PegawaiModel(); $data['pegawai'] = $pegawai->paginate(5); $data['pager'] = $pegawai->pager; return view('vw_pegawai', $data); } } |
Keterangan :
- Kita akan ubah method untuk mendapatkan data pegawai, yang sebelumnya findAll menjadi paginate, kita tuliskan angka 5 sebagai parameter method paginate, yang artinya setiap halaman akan menampilkan 5 data
- Berikutnya kita menambahkan key pager dalam array $data, dengan value menggunakan variabel $pegawai->pager;
Langkah berikutnya silahkan buka file dengan nama view dengan nama vw_pegawai.php, tambahkan code untuk menampilkan pagination dibagian view setelah tag </table>, tuliskan code dibawah ini :
|
1 |
<?= $pager->links() ?> |
Berikutnya kita coba mengakses halaman pegawainya, maka tampilannya adalah sebagai berikut :
Maka hasilnya akan ada pagination dibagian bawah tabel …, dan data yang ditampilkan adalah 5 data perhalaman..
Menampilkan Simple Pagination
Jika anda ingin menampilkan pagination dengan tampilan yang simple, dengan hanya ada tombol Newer, dan Older.
buka file view dengan nama vw_pegawai.php, silahkan ubah codenya :
|
1 |
<?= $pager->links() ?> |
Menjadi
|
1 |
<?= $pager->simpleLinks() ?> |
Maka untuk hasil tampilannya adalah sebagai berikut :
Membuat Custom Pagination di Codeigniter 4
Berikutnya kita akan belajar bagaimana cara untuk membuat tampilan custom dari Pagination, dalam contoh ini kita akan membuat custom pagination dengan tampilan pagination dari bootstrap.
Untuk Dokumentasi dari Bootstrap, terkait pagination bisa dilihat di URL :
https://getbootstrap.com/docs/5.0/components/pagination/
Untuk tampilan pagination yang akan kita buat dengan bootstrap 5, kurang lebih seperti berikut ini :
Untuk langkah – langkah pembuatannya adalah sebagai berikut :
Buat folder baru dengan nama pagers didalam folder app/Views, dan didalam folder tersebut kita buat file dengan nama bootstrap_pagination.php
Dan isi code didalam file bootstrap_pagination.php dengan code sebagai berikut :
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 |
<?php $pager->setSurroundCount(2) ?> <br /> <nav aria-label="Page navigation"> <ul class="pagination"> <?php if ($pager->hasPrevious()) : ?> <li class="page-item"> <a class="page-link" href="<?= $pager->getFirst() ?>" aria-label="<?= lang('Pager.first') ?>"> <span aria-hidden="true"><?= lang('Pager.first') ?></span> </a> </li> <li class="page-item"> <a class="page-link" href="<?= $pager->getPrevious() ?>" aria-label="<?= lang('Pager.previous') ?>"> <span aria-hidden="true"><?= lang('Pager.previous') ?></span> </a> </li> <?php endif ?> <?php foreach ($pager->links() as $link) : ?> <li class="page-item <?= $link['active'] ? 'active"' : '' ?>"> <a class="page-link" href="<?= $link['uri'] ?>"> <?= $link['title'] ?> </a> </li> <?php endforeach ?> <?php if ($pager->hasNext()) : ?> <li class="page-item"> <a class="page-link" href="<?= $pager->getNext() ?>" aria-label="<?= lang('Pager.next') ?>"> <span aria-hidden="true"><?= lang('Pager.next') ?></span> </a> </li> <li class="page-item"> <a class="page-link" href="<?= $pager->getLast() ?>" aria-label="<?= lang('Pager.last') ?>"> <span aria-hidden="true"><?= lang('Pager.last') ?></span> </a> </li> <?php endif ?> </ul> </nav> |
Keterangan :
Code diatas adalah hasil implementasi code dari dokumentasi resmi codeigniter 4 terkait pagination, yang saya sesuaikan dengan tampilan pagination pada bootstrap 5, untuk penjelasan lebih detail bisa dilihat di tutorial versi video yang kita upload youtube ya, karena penjelasannya lumayan rumit jika harus saya tulis disini juga..
Langkah berikutnya kita harus daftarkan custom pagination ini agar bisa digunakan, silahkan buka file dengan nama Pager.php di folder app/Config, dibagian variabel $templates silahkan tambahkan custom pagination tersebut.
|
1 2 3 4 5 6 |
public $templates = [ 'default_full' => 'CodeIgniter\Pager\Views\default_full', 'default_simple' => 'CodeIgniter\Pager\Views\default_simple', 'default_head' => 'CodeIgniter\Pager\Views\default_head', 'bootstrap_pagination' => 'App\Views\pagers\bootstrap_pagination', ]; |
Lalu berikutnya kita sudah bisa implementasikan ke bagian tampilan aplikasi, kita buka dulu controller dengan nama Pegawai.php dan silahkan ubah bagian method index menjadi sebagai berikut :
|
1 2 3 4 5 6 7 |
public function index() { $pegawai = new PegawaiModel(); $data['pegawai'] = $pegawai->paginate(5, 'pegawai'); $data['pager'] = $pegawai->pager; return view('vw_pegawai', $data); } |
Keterangan :
Yang kita ubah adalah dibagian method paginate, kita buat group paginate pada paremeter kedua dari method paginate, untuk memudahkan kita beri nama ‘pegawai’ sebagai parameter kedua paginate.
Berikutnya kita masuk ke file view dengan nama vw_pegawai.php dan kita ubah code yang digunakan untuk menampilkan bagian pagination, menjadi sebagai berikut ini :
|
1 |
<?= $pager->links('pegawai', 'bootstrap_pagination'); ?> |
Keterangan :
Jadi kita menuliskan method links, dimana method links memiliki 2 parameter yaitu :
- Parameter pertama adalah nama group data, dalam contoh ini adalah pegawai, sama seperti yang telah kita tulis dibagian controllers.
- Parameter kedua adalah nama tampilan pagination, dalam contoh ini adalah bootstrap_pagination sama seperti yang telah kita daftarkan
Maka hasilnya adalah sebagai berikut :
Maka tampilan paginationnya akan berganti seperti tampilan pagination di bootstrap
Memperbaiki urutan nomor dibagian pagination
Berikutnya kita akan perbaiki bagian penomeran dari hasil pagination, coba perhatikan saat kita mengakses halaman berikutnya, semisal kita mengakses halaman kedua dalam tampilan data pegawai
Terlihat pada gambar diatas, pada halaman 2 nomor dimulai angka dari angka 1, harusnya kan tidak seperti itu, harusnya kita memulai dari angka 6, karena setiap halaman ada 5 data yang ditampilkan. nah kita akan mengatasi hal ini, langkah – langkahnya adalah sebagai berikut :
Langkah awal kita buat helper agar mempermudahkan kita membuat method yang bisa diakses dari manapun, silahkan buat file dengan nama myhelper_helper.php didalam folder app/Helpers, dan isikan codenya sebagai berikut ini :
|
1 2 3 4 5 6 7 8 9 10 11 12 |
<?php if (!function_exists('nomor')) { function nomor($currentPage, $perPage) { if (is_null($currentPage)) { $nomor = 1; } else { $nomor = 1 + ($perPage * ($currentPage - 1)); } return $nomor; } } |
Keterangan :
Method diatas digunakan untuk membuat pengurutan nomor pada halaman saat pagination digunakan, dengan aturan :
- Nomor akan dimulai dari angka 1 untuk halaman 1
- Untuk halaman lebih dari 1 akan menggunakan rumus (1 + (jumlah data perhalaman *(posisi halaman – 1)))
Berikutnya kita daftarkan helper agar bisa digunakan dibagian controller, silahkan buka file dengan nama BaseController.php lalu tuliskan code berikut ini :
|
1 |
helper('myhelper'); |
Dibagian function initController, jadi kurang lebih seperti ini :
|
1 2 3 4 5 6 7 8 9 10 11 12 |
public function initController(\CodeIgniter\HTTP\RequestInterface $request, \CodeIgniter\HTTP\ResponseInterface $response, \Psr\Log\LoggerInterface $logger) { // Do Not Edit This Line parent::initController($request, $response, $logger); helper('myhelper'); //-------------------------------------------------------------------- // Preload any models, libraries, etc, here. //-------------------------------------------------------------------- // E.g.: // $this->session = \Config\Services::session(); } |
Lalu berikutnya kita sudah bisa menggunakan helper tersebut dibagian controller, buka file controller dengan nama Pegawai.php dan ubah bagian method index menjadi seperti berikut ini :
|
1 2 3 4 5 6 7 8 |
public function index() { $pegawai = new PegawaiModel(); $data['pegawai'] = $pegawai->paginate(5, 'pegawai'); $data['pager'] = $pegawai->pager; $data['nomor'] = nomor($this->request->getVar('page_pegawai'), 5); return view('vw_pegawai', $data); } |
Keterangan :
Kita buat key dengan nama nomor didalam array $data, dimana untuk nilainya kita ambil dari method nomor (method yang berasal dari helper) pada method ini karena membutuhkan 2 parameter sehingga kita tuliskan 2 value parameter sebagai berikut :
- Parameter 1 merupakan posisi dari halamannya kita menggunakan perintah getVar untuk mendapatkan datanya pada variabel page_pegawai, kenapa kok page_pegawai karena kita set group pagination dengan nama pegawai, sehingga data halaman bisa kita akses melalui nama page_pegawai
- Parameter 2 merupakan posisi jumlah data perhalaman, dalam contoh ini kita tuliskan 5
Berikutnya kita buka file view dengan nama vw_pegawai.php kita akan ubah variabel yang digunakan untuk menampilkan data nomor, sehingga kurang lebih menjadi seperti berikut ini :
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
<?php foreach ($pegawai as $row) { ?> <tr> <td><?= $nomor++; ?></td> <td><?= $row->nama; ?></td> <td><?= $row->jenis_kelamin; ?></td> <td><?= $row->no_telp; ?></td> <td><?= $row->email; ?></td> <td><?= $row->tanggal_lahir; ?></td> <td><?= $row->alamat; ?></td> </tr> <?php } ?> |
Berikutnya kita akan coba menampilkan hasilnya, silahkan akses halaman tampil data pegawai, dan coba akses ke halaman kedua harusnya tampilannya adalah sebagai berikut ini :
Maka pada halaman kedua, nomor dimulai dari angka 6 bukan 1.
Jadi kurang lebih semacam itu ya teman – teman tutorial kali ini kita sudah belajar bagaimana cara untuk mengatur tampilan pagination di codeigniter 4, jika teman – teman kesulitan bisa download source code di github :
Sekian dulu, jika ada yang ingin didiskusikan silahkan di kolom komentar… , sampai jumlah di tutorial Codeigniter 4 selanjutnya
