Riunix's Blog

Bagi programmer pasti sering membuat aplikasi yang menampilkan data. Nah, apabila data yang mau ditampilkan sedikit, itu tidak masalah, tapi bagaimana jika data  yang mau ditampilkan jumlahnya puluhan bahkan ratusan maka pengguna akan menghadapi scrool window yang sangat panjang (sampe cape scrool-nya :P)  dan loading-nya  akan lama. Nah, untuk mengatasi hal ini digunakan satu sistem yang sudah banyak dikenal yaitu Sistem Paging. Sistem Paging adalah sistem dimana menampilkan data-data yang ada secara bertahap, jadi data tidak ditampilkan semua, data dibagi menjadi beberapa halaman dengan masing-masing halaman hanya memiliki beberapa data saja. Kemudian jika halaman tujuan diklik baru data pada halaman tersebut ditampilkan, jadi proses loading yang terjadi tidak lama.
Sistem Paging ini saya jelaskan lebih dikhususkan untuk penggunaan pada Website.
Sekarang saya akan menjelaskan dulu logika dasar dari sistem Paging. Perhatikan table di bawah ini :












Sebagai  contoh, kita memiliki 22 record daftar telepon, kemudian ingin kita tampilkan dengan dibagi menjadi beberapa halaman dengan maksimum 5 record per halaman.
Nah, pertama kita cari dulu jumlah halaman yang akan terbentuk :

Jumlah Halaman = Total Record / Maksimum Record tiap halaman
Jumlah Halaman = 22 / 5 = 4.4 Halaman

Ibarat kan saja halaman itu halaman pada buku novel  ukuran kertas A4,dimana ada sisa sedikit cerita yang tidak muat lagi untuk ditampilkan di halaman terakhir, mau tak mau kertas musti ditambah satu lagi guna menempatkan sisa cerita yang ada (walaupun hanya menggunakan separo dari ukuran kertas saja. Maka dari itu setiap perhitungan Jumlah Halaman kita akan bulatkan ke atas.

Jumlah Halaman = 22 / 5 = 4.4 = 5 Halaman

Kemudian setelah jumlah halaman didapat, kita lakukan pencetakan nomor halaman (berupa link). Masing-masing halaman/link diberi value kelipatan 5 (jumlah maksimum record per halaman) dimulai dari 0 (karena perhitungan record dari database dimulai dari 0). Jadi pada halaman 1 akan memiliki value 0, halaman 2 memiliki value 5,dst . Dapat dilihat pada table di atas. Value ini akan dipakai sebagai penanda awal record yang akan ditampilkan. Halaman 1 akan dimulai dari record ke-0, halaman 2 dimulai dari record yang ke-5,dst. 

Nah,ini logika sistem paging yang saya pikiran. Sekarang saya akan menjelaskan menggunkan coding PHP.

function paging($curRec,$totalRec,$maxRec){         $totalPage=ceil($totalRec/$maxRec);         $curPage=ceil(($curRec+1)/$maxRec);         $str="";                 /*--------------------------prev button-----------------------*/         if($curPage>1){             $rec=($curPage-2)*$maxRec;                                $str.=’ <a href= “?cur=’.$rec.’”>prev</a>’;                    }         /*-------------------------generate page number----------------*/         for($i=1;$i<=$totalPage;$i++){             if($i==$curPage){                 $bold=true;             }else{                 $bold=false;             }             $rec=($i-1)*$maxRec;                                $angka=($bold)?”<b>”.$i.”</b>”:$i;             $str.=’ <a href= “?cur=’.$rec.’”>’.$angka.’</a>’;            }                 /*--------------------------next button-----------------------*/         if($curPage<$totalPage){             $rec=($curPage*$maxRec);                                $str.=’ <a href= “?cur=’.$rec.’”>next</a>’;                    }                 return $str;             }

Saya akan jelaskan perbagian.

function paging($curRec,$totalRec,$maxRec){

Disini, Paging saya buat dalam bentuk function , jadi bisa dipakai dengan mudah setiap saat. Paramater yang diterima oleh function paging ini ada 3 yaitu :

1. $curRec = digunakan untuk memberitaukan function record pertama dari halaman yang sedang aktif.
2. $totalRec =berisi total record yang berada di dalam database.
3. $maxRec= berisi informasi maksimum record yang boleh ditampilkan tiap halaman.

 

$totalPage=ceil($totalRec/$maxRec);

Nah ini untuk mencari total halaman yang akan dibentuk (seperti yang sudah dijelaskan logikanya di atas).

$curPage=ceil(($curRec+1)/$maxRec); $str="";

Di atas tadi dijelaskan bahwa masing-masing halaman diberi value, nah value itu akan dipakai disini untuk mengetahui halaman yang sedang aktif dengan menggunakan rumus diatas.Untuk rumusnya, jangan tanya kenapa, itu juga saya ketemu sendiri dengan mencari kecocok2an, kalo penasaran coba tes saja.  Kemudian sediakan satu variable kosong untuk menyimpan string paging.

 

/*--------------------------prev button-----------------------*/                                 if($curPage>1){                                                 $rec=($curPage-2)*$maxRec;                                                                                                                    $str.=’ <a href= “?cur=’.$rec.’”>prev</a>’;                                                                          }                                 /*-------------------------generate page number----------------*/                                 for($i=1;$i<=$totalPage;$i++){                                                 if($i==$curPage){                                                                 $bold=true;                                                 }else{                                                                 $bold=false;                                                 }                                                 $rec=($i-1)*$maxRec;                                                                                                                    $angka=($bold)?”<b>”.$i.”</b>”:$i;                                            $str.=’ <a href= “?cur=’.$rec.’”>’.$angka.’</a>’;                                     }                                                                 /*--------------------------next button-----------------------*/                                 if($curPage<$totalPage){                                                 $rec=($curPage*$maxRec);                                                                                                                        $str.=’ <a href= “?cur=’.$rec.’”>next</a>’;                                                                          }

Nah setelah perhitungan tadi, maka kita sudah bisa mencetak /membuat paging dengan code di atas. Supaya gak bingung dengan code diatas, coba baca code-nya sambil melihat table yang sudah saya kasi diatas. Ini saya sertakan file php-nya supaya lebih jelas. Kalo masih bingung jg, bs hubungi saya ke email, kalo sempat saya balas .

contoh paging (tanpa database)

contoh paging (dengan database)