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

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

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

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

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

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

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

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

rosihanari.rosihanari.net URL to article: http://blog.net [4] FREE PROGRAMMING TOOLS. Access [13] Mudahnya Membuat Barcode dengan PHP [14] Article printed from Rosihan Ari`s Blog: http://blog.rosihanari.. Rating: 10. [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.html [3] di blog ini: http://blog. tapi gak papa deh.zip.rosihanari.Rosihan Ari`s Blog » Ide Membuat Advanced Paging dengan PHP » Print http://blog.net/script-php-menampilkan-hasilpencarian-multikategori-dengan-advanced-paging [6] Membuat Nomor Urut Hasil Query di PHP (Combined with Paging): http://blog.net/ide-membuat-advance-paging-dengan-php/print/ ?> Wah panjang juga ya artikelnya.net [2] Download Script: http://www.net [5] Script PHP Menampilkan Hasil Pencarian Multikategori dengan Advanced Paging: http://blog.rosihanari. 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.net/ide-membuat-advance-paging-dengan-php URLs in this post: [1] member saya: http://source.com/download/4546154/paging.ziddu.rosihanari.0/10 (4 votes cast) Jika Anda Anda ingin mendownload beberapa tool programming 100% gratis? Silakan download di FREE PROGRAMMING TOOLS.: http://programmingtools. Selamat mencoba dan berpaging ria ingin mendownload scriptnya. mudah-mudahan ada manfaatnya bagi Anda.rosihanari.rosihanari.net/membuat-nomor-urut-hasil-query-di-phpcombined-with-paging 9 of 10 9/25/2010 7:58 PM .

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

Sign up to vote on this title
UsefulNot useful