Rosihan Ari`s Blog » Ide Membuat Advanced Paging dengan PHP » Print

http://blog.rosihanari.net/ide-membuat-advance-paging-dengan-php/print/

- Rosihan Ari`s Blog - http://blog.rosihanari.net -

Ide Membuat Advanced Paging dengan PHP
Posted By rosihanari On April 30, 2009 @ 7:18 pm In PHP,Programming,SQL | 136 Comments

Paging merupakan teknik menampilkan data dengan cara membaginya ke beberapa halaman. Teknik ini diberikan untuk mengurangi scrolling window apabila data yang disajikan terlalu banyak, sehingga akan menimbulkan kejemuan orang yang melihat dan juga akan menghasilkan page load time yang besar karena ukuran filenya besar (apabila data disajikan dalam satu halaman saja). Untuk keperluan navigasi data biasanya disajikan dengan link berupa nomor halaman atau kadang berbentuk Previous dan Next. Pada tutorial ini akan dipaparkan bagaimana ide membuat advance paging ini dilakukan. Advance paging adalah paging yang navigasinya berbentuk 1 2 3 4 … 20 Next >> Contoh tampilan di atas diasumsikan terdapat 20 halaman paging dan halaman yang sedang aktif adalah halaman 1. Bila yang aktif halaman 10, maka tampilan navigasinya adalah: << Prev 1 ... 7 8 9 10 11 12 13 … 20 Next >> Sedangkan bila yang aktif adalah halaman terakhir (20) maka tampilan navigasinya adalah << Prev 1 .. 17 18 19 20 Dalam contoh ini kasus advance paging ini akan diterapkan pada data guestbook atau buku tamu. Istilah ‘advance paging’ ini adalah istilah saya saja sih Mau tau bagaimana ide dan cara membuatnya? simak baik-baik artikel ini. Artikel ini merupakan request dari mas Sadeli (salah satu member saya
[1]

)

Pertama kita siapkan terlebih dahulu tabel untuk menyimpan datanya: CREATE TABLE guestbook ( id int(11) auto_increment, nama varchar(20), email varchar(20), tanggal date, komentar text, PRIMARY KEY (id) ) Selanjutnya kita buat skenario dari paging ini. Misalkan kita akan membuat paging dengan jumlah data yang ditampilkan per halaman adalah sejumlah 5 buah. Sehingga kita perlu membuat variabel untuk menyimpan jumlah data yang akan ditampilkan per halaman. show.php <?php // koneksi ke mysql mysql_connect('namahost', 'dbuser', 'dbpassword'); mysql_select_db(data);

1 of 10

9/25/2010 7:58 PM

pastilah data yang ditampilkan adalah data ke – 0. Untuk menuju ke halaman 2. misalkan terdapat 15 data dalam tabel guestbook dimana kita ingin menyajikan pada setiap halaman adalah 5 data. // apabila $_GET['page'] sudah didefinisikan. Query SQL yang digunakan adalah SELECT * FROM guestbook LIMIT offset. // jumlah data yang akan ditampilkan per halaman $dataPerPage = 5. data pada baris kedua disebut data pada posisi ke-1. if(isset($_GET['page'])) { $noPage = $_GET['page']. ?> Selanjutnya. apa kaitannya offset dengan paging? Sabar… perhatikan dulu contoh berikut ini Sebagai contoh. 7. Sedangkan halaman kedua. belum diberikan pada URL maka secara otomatis menuju ke nomor halaman 1. URL nya http://namaserver/show. . Lantas apa gunanya offset tersebut? Offset nantinya akan digunakan pada query SQL untuk memunculkan data pada setiap halaman. . dan seterusnya.php maka otomatis menuju ke halaman 1. 6. Sedangkan untuk menuju ke halaman 3. 'dbpassword'). data awal yang ditampilkan adalah data pada urutan ke-0. . maka kita tambahkan perintah <?php mysql_connect('namahost'. 14.rosihanari. mysql_select_db('dbname').. Perlu Anda tahu. data ke 10.php?page=3. 1. Data pada baris pertama hasil query SQL disebut data pada posisi ke-0. Nah… perhatikan bahwa untuk halaman 1. data yang ditampilkan adalah 5.. 2. 12. nomor halamannya 1. Untuk halaman pertama. Dari skenario di atas tampak bahwa bila parameter ?page=. } else $noPage = 1. Untuk script paging ini. maka perintahnya 2 of 10 9/25/2010 7:58 PM .Rosihan Ari`s Blog » Ide Membuat Advanced Paging dengan PHP » Print http://blog. Offset digunakan untuk mengatur posisi awal data yang akan ditampilkan perhalaman. Untuk mewujudkan hal ini. jumlahData. bahwa data dalam database memiliki urutan seperti halnya array. Serta halaman ketiga. Sehingga untuk memunculkan data guestbook pada halaman pertama. dst. 3 dan 4. Sedangkan bila terdapat parameter ?page=… maka nomor halamannya menyesuaikan nilai pada parameter ?page tersebut. 13. . 11. 'dbuser'. bila dibuka pertama kali dengan URL http://namaserver/show. dan 9. gunakan nomor halaman tersebut. maka URL nya http://namaserver/show.php?page=2. dalam teknik paging perlu adanya pengaturan posisi awal data atau lebih dikenal dengan istilah offset. ?> Kita lanjutkan skenarionya. 8. Dengan demikian total terdapat 3 halaman dalam pagingnya. halaman 2 data awalnya adalah data pada urutan ke-5 dan halaman 3 data pada urutan ke 10.. . Trus. // sedangkan apabila belum.net/ide-membuat-advance-paging-dengan-php/print/ // jumlah data yang akan ditampilkan per halaman $dataPerPage = 5.

OK. so. // query SQL untuk menampilkan data perhalaman sesuai offset $query = "SELECT * FROM guestbook LIMIT $offset. deh. Lho kok bisa? he. // jumlah data yang akan ditampilkan per halaman $dataPerPage = 5..Rosihan Ari`s Blog » Ide Membuat Advanced Paging dengan PHP » Print http://blog. dan seterusnya. perintahnya: SELECT * FROM guestbook LIMIT 5. dah paham.net/ide-membuat-advance-paging-dengan-php/print/ SELECT * FROM guestbook LIMIT 0. nomor halamannya 1..$data['komentar']."</td><td>".. gunakan nomor halaman tersebut. dah paham tentang offset. Bener kan? OK. while($data = mysql_fetch_array($result)) { echo "<tr><td>".1) * $dataPerPage. // perhitungan offset $offset = ($noPage ."</td><td>". deh. 5. dan untuk memunculkan data pada halaman ketiga. maka hubungan antara offset. nilai $offset = (2 – 1) * 5 = 5 dan halaman ketiga $offset = (3 – 1) * 5 = 10. } 3 of 10 9/25/2010 7:58 PM . Untuk memunculkan data pada halaman kedua. trus yang jadi masalah adalah bagaimana menentukan offset pada setiap halamannya? Bila kita lihat patternnya. Untuk halaman 2."</td></tr>". $dataPerPage".$data['tanggal']. kita bisa tambahkan scriptnya untuk mencari offset dan query SQL nya. // sedangkan apabila belum. 5. } else $noPage = 1."</td><td>". mysql_select_db('dbname').rosihanari. perintahnya: SELECT * FROM guestbook LIMIT 10. // apabila $_GET['page'] sudah didefinisikan. maka nilai offset = (1 – 1) * 5 = 0. <?php mysql_connect('namahost'. 'dbpassword').$data['email'].. Untuk halaman 1. $result = mysql_query($query) or die('Error'). 3x kita cek saja. 'dbuser'. if(isset($_GET['page'])) { $noPage = $_GET['page']. jumlah data yang ingin ditampilkan per halaman dan nomor halamannya adalah: offset = (no halaman – 1) * jumlah data per halaman. echo "<tr><td>Nama</td><td>Email</td><td>Tanggal</td><td>Komentar</td></tr>". // menampilkan data echo "<table border='1'>".. 5.$data['nama'].

// menampilkan data echo "<table border='1'>". // apabila $_GET['page'] sudah didefinisikan. $result = mysql_query($query). // query SQL untuk menampilkan data perhalaman sesuai offset $query = "SELECT * FROM guestbook LIMIT $offset.net/ide-membuat-advance-paging-dengan-php/print/ echo "</table>". while($data = mysql_fetch_array($result)) { 4 of 10 9/25/2010 7:58 PM . } else $noPage = 1. // perhitungan offset $offset = ($noPage . dan sekarang kita bisa tambahkan proses menghitung jumlah data dan jumlah halaman pada scriptnya. if(isset($_GET['page'])) { $noPage = $_GET['page']. OK… I know. maka total ada berapa halaman yang dibutuhkan? OK. ceil() adalah function yang digunakan untuk membulatkan ke atas suatu bilangan.. // jumlah data yang akan ditampilkan per halaman $dataPerPage = 5. mysql_select_db('dbname').1) * $dataPerPage. ceil(3. Sehingga dari pattern tersebut formula untuk menghitung jumlah halaman adalah jumlah halaman = ceil(jumlah data / data per halaman). total ada berapa halaman? OK. Untuk menghitung total jumlah halaman. Trus… kalo ada 31 data dan kita ingin menyajikan data sejumlah 5 per halaman.7) = 4. SELECT COUNT(*) FROM guestbook. Misalkan terdapat 15 data.. nomor halamannya 1. .rosihanari. . benar ada 7 (untuk halaman ke-7 hanya tampil 1 buah data). // sedangkan apabila belum. Misal ceil(3. kita cari patternnya terlebih dahulu. 'dbuser'. benar ada 3. dan kita ingin menyajikan data sejumlah 5 per halaman. 'dbpassword'). gunakan nomor halaman tersebut. <?php mysql_connect('namahost'. ?> Nah… masalah berikutnya adalah bagaimana menentukan total jumlah halamannya? Hal ini penting karena nantinya akan ditampilkan sebagai link navigasi pagingnya. $dataPerPage".Rosihan Ari`s Blog » Ide Membuat Advanced Paging dengan PHP » Print http://blog. echo "<tr><td>Nama</td><td>Email</td><td>Tanggal</td><td>Komentar</td></tr>".2) = 4. Trus… yang jadi masalah adalah bagaimana mendapatkan jumlah datanya? Nah… untuk mendapatkan jumlah data keseluruhan yang ada kita gunakan query SQL.

$data['nama']."</td></tr>". 5 of 10 9/25/2010 7:58 PM . $data = mysql_fetch_array($hasil). // sedangkan apabila belum. } echo "</table>". // mencari jumlah semua data dalam tabel guestbook $query = "SELECT COUNT(*) AS jumData FROM guestbook". terdapat link << prev. tunggu dulu pada desain advance paging di atas.. // perhitungan offset $offset = ($noPage .net/ide-membuat-advance-paging-dengan-php/print/ echo "<tr><td>"."'>&lt. Prev</a>". 'dbpassword'). Kita hanya menggunakan looping saja. gunakan nomor halaman tersebut... // menentukan jumlah halaman yang muncul berdasarkan jumlah semua data $jumPage = ceil($jumData/$dataPerPage). mysql_select_db('dbname'). if(isset($_GET['page'])) { $noPage = $_GET['page']. Tapi eit. caranya mudah. ?> Nah… sekarang tinggal bagaimana cara memunculkan link berisi nomor halaman yang menuju ke setiap halamannya. .($noPage-1). $jumData = $data['jumData']. "<a href='"."?page=".&lt..$data['komentar'].$data['tanggal'].Rosihan Ari`s Blog » Ide Membuat Advanced Paging dengan PHP » Print http://blog. tepat sekali yaitu ketika nomor halaman yang sedang aktif (sedang dibuka) setelah halaman pertama atau $noPage > 1. nomor halamannya 1. benar yaitu menuju ke nomor halaman sebelumnya ($noPage – 1). $hasil = mysql_query($query).1) * $dataPerPage. menuju ke nomor halaman berapakah link tersebut? yap. } else $noPage = 1.$_SERVER['PHP_SELF']."</td><td>".."</td><td>". Trus.rosihanari. Kapan link ini akan muncul? ya."</td><td>". sebelum memunculkan link nomor halaman. // jumlah data yang akan ditampilkan per halaman $dataPerPage = 5.$data['email']. Untuk memunculkan nomor halamannya. . $dataPerPage". // query SQL untuk menampilkan data perhalaman sesuai offset $query = "SELECT * FROM guestbook LIMIT $offset. Dengan demikian kita bisa tambahkan perintah berikut ini pada script if ($noPage > 1) echo sehingga menjadi <?php mysql_connect('namahost'. 'dbuser'. // apabila $_GET['page'] sudah didefinisikan.

$data['tanggal']. if (($showPage != ($jumPage . = mysql_fetch_array($hasil)."</td><td>"."?page=". } } Konsep loopingnya sederhana. $jumData = $data['jumData'].$_SERVER['PHP_SELF'].rosihanari. Adapun perintah-perintahnya adalah seperti di bawah ini."."</td></tr>". yaitu menuliskan link nomor halaman mulai dari 1 s/d jumlah halamannya. echo "<tr><td>Nama</td><td>Email</td><td>Tanggal</td><td>Komentar</td></tr>". else echo " <a href='". $page++) { if ((($page >= $noPage . Maksud dari syarat if ((($page >= $noPage . } "<a href='".$page. . ?> Berikutnya kita akan tampilkan link nomor-nomor halamannya menggunakan looping. for($page = 1.1)) && ($page == $jumPage)) echo "."'>". = mysql_query($query).($noPage-1).Rosihan Ari`s Blog » Ide Membuat Advanced Paging dengan PHP » Print http://blog.$page.."</b> ". $page <= $jumPage."'>&lt.$data['komentar']."</td><td>". ."</td><td>"."?page=".. // menampilkan link previous if ($noPage > 1) echo .3) && ($page <= $noPage + 3)) || ($page == 1) || ($page == $jumPage)) { if (($showPage == 1) && ($page != 2)) echo ".$data['nama']. Namun harap dicatat di sini bahwa karena tidak semua nomor halaman ditampilkan sesuai desain sebelumnya maka kita perlu berikan syarat. // mencari jumlah semua data dalam tabel guestbook $query $hasil $data = "SELECT COUNT(*) AS jumData FROM guestbook".&lt.$_SERVER['PHP_SELF']. $showPage = $page..".net/ide-membuat-advance-paging-dengan-php/print/ $result = mysql_query($query) or die('Error').3) && ($page <= $noPage + 3)) || ($page == 1) || ($page == $jumPage)) { . 6 of 10 9/25/2010 7:58 PM .$page.$data['email']. Prev</a>".. if ($page == $noPage) echo " <b>". // menampilkan data echo "<table border='1'>". } echo "</table>". while($data = mysql_fetch_array($result)) { echo "<tr><td>"."</a> ". // menentukan jumlah halaman yang muncul berdasarkan jumlah semua data $jumPage = ceil($jumData/$dataPerPage).

$page. Demikian pula untuk perintah if (($showPage != ($jumPage .Rosihan Ari`s Blog » Ide Membuat Advanced Paging dengan PHP » Print http://blog.$page.($noPage+1)."?page=".rosihanari. // apabila $_GET['page'] sudah didefinisikan. maka tanda ini tidak muncul."?page=". maka nanti diharapkan nomor halaman yang muncul adalah 1 4 5 6 7 8 9 10 15 Anda dapat mengubah rentang halaman sesuai yang diinginkan.". Sehingga dari kedua perintah di atas diharapkan akan menampilkan nomor halaman seperti di bawah ini 1 … 4 5 6 7 8 9 10 … 15 (bila yang aktif adalah halaman 7) 1 2 3 4 5 6… 15 (bila yang aktif adalah halaman 2) 1 … 10 11 12 13 14 15 (bila yang aktif adalah halaman 13) Sedangkan perintah if ($page == $noPage) echo " <b>".. mysql_select_db('dbname').$page.. gunakan nomor halaman tersebut..1)) && ($page == $jumPage)) echo ". Apabila setelah 1 ini muncul 2.$_SERVER['PHP_SELF']. // sedangkan apabila belum. digunakan untuk menampilkan link nomor halaman..net/ide-membuat-advance-paging-dengan-php/print/ adalah hanya memunculkan link nomor halaman 1 dan juga halaman terakhir. Perintah if (($showPage == 1) && ($page != 2)) echo ".$_SERVER['PHP_SELF']. if(isset($_GET['page'])) { 7 of 10 9/25/2010 7:58 PM . OK kapan link ini muncul? ya benar… yaitu ketika halaman yang sedang aktif bukanlah pada halaman terakhir atau sebelum halaman terakhir. Terakhir. kita perlu link untuk memunculkan next >>. // jumlah data yang akan ditampilkan per halaman $dataPerPage = 5. Perintah di atas digunakan untuk memunculkan tanda ‘…’ sebelum nomor halaman terakhir bila halaman sebelumnya yang muncul bukan ‘nomor halaman terakhir – 1′.</a>". Sedangkan pada nomor halaman yang sedang aktif nomor halaman hanya dicetak tebal saja untuk menunjukkan bahwa halaman yang sedang aktif adalah halaman tersebut.. 'dbuser'. 'dbpassword'). nomor halamannya 1. sehingga scriptnya menjadi <?php mysql_connect('namahost'. Tapi perlu diingat bahwa tanda ini akan muncul bila nomor halaman yang muncul setelah 1 ialah bukan 2. sekaligus pula nomor-nomor halaman dalam rentang 3 halaman sebelum dan sesudah nomor halaman yang aktif."'>Next &gt.". Sehingga kita bisa tambahkan perintah if ($noPage < $jumPage) echo "<a href='". Contoh jika halaman yang aktif adalah halaman 7 dari 15 halaman. pada script. Digunakan untuk memunculkan tanda ‘…’ di antara halaman nomor 1 dengan halaman berikutnya yang tampil."</a> "."'>"."</b> ".&gt. else echo " <a href='". Namun link dari nomor halaman ini ditampilkan hanya pada nomor halaman yang sedang tidak aktif.

} echo "</table>". // menentukan jumlah halaman yang muncul berdasarkan jumlah semua data $jumPage = ceil($jumData/$dataPerPage). } else $noPage = 1.$data['tanggal']. // menampilkan link previous if ($noPage > 1) echo "<a href='". // query SQL untuk menampilkan data perhalaman sesuai offset $query = "SELECT * FROM guestbook LIMIT $offset. Prev</a>". $dataPerPage". if ($page == $noPage) echo " <b>".$_SERVER['PHP_SELF'].$page.$data['komentar']. $page <= $jumPage.$_SERVER['PHP_SELF']."</td></tr>".$data['email']. // mencari jumlah semua data dalam tabel guestbook $query $hasil $data = "SELECT COUNT(*) AS jumData FROM guestbook". $showPage = $page."</b> "."'>&lt.$page. = mysql_query($query).". 8 of 10 9/25/2010 7:58 PM . // menampilkan data echo "<table border='1'>".$data['nama'].($noPage-1). // memunculkan nomor halaman dan linknya for($page = 1. = mysql_fetch_array($hasil)."?page=". // perhitungan offset $offset = ($noPage ."'>".1)) && ($page == $jumPage)) echo "."?page=".Rosihan Ari`s Blog » Ide Membuat Advanced Paging dengan PHP » Print http://blog. } } // menampilkan link next if ($noPage < $jumPage) echo "<a href='". else echo " <a href='"."?page=".$_SERVER['PHP_SELF'].&gt."</td><td>"."..</a>". echo "<tr><td>Nama</td><td>Email</td><td>Tanggal</td><td>Komentar</td></tr>".1) * $dataPerPage. $page++) { if ((($page >= $noPage .3) && ($page <= $noPage + 3)) || ($page == 1) || ($page == $jumPage)) { if (($showPage == 1) && ($page != 2)) echo "..rosihanari."</a> ".&lt."</td><td>". $result = mysql_query($query) or die('Error'). $jumData = $data['jumData'].net/ide-membuat-advance-paging-dengan-php/print/ $noPage = $_GET['page']."</td><td>"...$page. if (($showPage != ($jumPage .($noPage+1). while($data = mysql_fetch_array($result)) { echo "<tr><td>"."'>Next &gt.

silakan download di bawah ini [ Download Script [2] ] Jangan lupa terus stay tune di blog ini [3] karena pasti akan ada artikel-artikel menarik yang lain daripada yang lain seputar programming.0/10 (4 votes cast) Jika Anda Anda ingin mendownload beberapa tool programming 100% gratis? Silakan download di FREE PROGRAMMING TOOLS.rosihanari.zip.net [2] Download Script: http://www.html [3] di blog ini: http://blog.rosihanari.rosihanari.net/script-php-menampilkan-hasilpencarian-multikategori-dengan-advanced-paging [6] Membuat Nomor Urut Hasil Query di PHP (Combined with Paging): http://blog. Access [13] Mudahnya Membuat Barcode dengan PHP [14] Article printed from Rosihan Ari`s Blog: http://blog. Selamat mencoba dan berpaging ria ingin mendownload scriptnya. tapi gak papa deh.Rosihan Ari`s Blog » Ide Membuat Advanced Paging dengan PHP » Print http://blog.rosihanari.rosihanari.ziddu.net [5] Script PHP Menampilkan Hasil Pencarian Multikategori dengan Advanced Paging: http://blog.rosihanari. Rating: 10.: http://programmingtools.net/ide-membuat-advance-paging-dengan-php URLs in this post: [1] member saya: http://source.rosihanari.net [4] FREE PROGRAMMING TOOLS.net URL to article: http://blog. mudah-mudahan ada manfaatnya bagi Anda.com/download/4546154/paging.rosihanari..net/membuat-nomor-urut-hasil-query-di-phpcombined-with-paging 9 of 10 9/25/2010 7:58 PM .net/ide-membuat-advance-paging-dengan-php/print/ ?> Wah panjang juga ya artikelnya. [4] atau ingin berdonasi untuk pengembangan blog ini cukup dengan $1 via Paypal? Beberapa artikel terkait Script PHP Menampilkan Hasil Pencarian Multikategori dengan Advanced Paging [5] Membuat Nomor Urut Hasil Query di PHP (Combined with Paging) [6] Teknik Membuat On Page Paging [7] Membuat Nomor Halaman (Paging) di WordPress [8] Ide Membuat Sistem Login Aplikasi Multi User [9] Ide Membuat Generator Kode Unik Incremental Otomatis [10] Ide Membuat Script Upload Download File Dengan Batasan Hak Akses [11] Teknik Debugging Script PHP + MySQL [12] Script INSERT Data Dengan PHP dan MS.

rosihanari. All rights reserved.rosihanari.rosihanari.net/ide-membuat-sistem-login-aplikasi-multi-user [10] Ide Membuat Generator Kode Unik Incremental Otomatis: http://blog.net/ide-membuat-script-upload-downloadfile-dengan-batasan-hak-akses [12] Teknik Debugging Script PHP + MySQL: http://blog.rosihanari. 10 of 10 9/25/2010 7:58 PM .net/membuat-nomor-halaman-paging-di-wordpress [9] Ide Membuat Sistem Login Aplikasi Multi User: http://blog. Access: http://blog.net/teknik-debugging-script-php-mysql [13] Script INSERT Data Dengan PHP dan MS.rosihanari.rosihanari.rosihanari.net/mudahnya-membuat-barcode-dengan-php Copyright © 2009 Rosihan Ari`s Blog.rosihanari.net/ide-membuat-advance-paging-dengan-php/print/ [7] Teknik Membuat On Page Paging: http://blog.net/script-insert-data-dengan-php-dan-ms-access [14] Mudahnya Membuat Barcode dengan PHP: http://blog.Rosihan Ari`s Blog » Ide Membuat Advanced Paging dengan PHP » Print http://blog.rosihanari.net/teknik-membuat-on-page-paging [8] Membuat Nomor Halaman (Paging) di WordPress: http://blog.net/ide-membuat-generator-kode-unik-incrementalotomatis [11] Ide Membuat Script Upload Download File Dengan Batasan Hak Akses: http://blog.