Paging is one of the essential feature for data driven website to implement. Whenever user search in the site, there may be thousands of results for the keyword what he/she search. Of course, you could show all results on one page. But it will slow down the loading of your page and user may leave your page. So it is better to split the records into pages with a certain number of records per page.

Have you ever used paging control for your web site before? Does it support Ajax? Without Ajax, entire page will be loaded from server whenever user change the page index. With Ajax, you can retrieve data from the server asynchronously in the background without interfering with the display and behavior of the existing page. I would like to share you how to create the paging control with php and Ajax without refreshing the entire page. It is not the complete control to use out of the box. But you can modified it to fit in your requirement.



<?php

function get_paging($records_count,$records_per_page)
{

if (isset($_GET["page"]))
 $selected_page = $_GET["page"];
else
 $selected_page = 1;

$number_of_pages = ($records_count / $records_per_page);

if($number_of_pages > (int) $number_of_pages)
 $number_of_pages = (int)($number_of_pages) + 1;

$min_page_number = (int)($selected_page - 5);
$max_page_number = (int)($selected_page + 5);

if($min_page_number < 1)
{
 $min_page_number = 1;
 $max_page_number =  11;
 $max_page_number = ($max_page_number > $number_of_pages) ? $number_of_pages : 11;
}

if($max_page_number > $number_of_pages)
{
 $max_page_number = $number_of_pages;
 $min_page_number = $max_page_number - 10;
 $min_page_number = ($min_page_number < 1) ? 1 : $max_page_number - 10;
}

if($records_count <= $records_per_page){
 $min_page_number = 1;
 $max_page_number = $records_per_page;
}

$goto = '<td><nobr><input type="text" style="width:35px; text-align:center;" id="txtGotoPage" title="Go to page" onkeypress="isValid(event)" /><input id="btnGoTo" type="button" value="Go" title="Go to page" onclick="GotoPage(document.getElementById(&#39;txtGotoPage&#39;).value);"/></nobr></td>';
$pages = '';

if($selected_page > 1 && $number_of_pages > 1) {
 $first = '<td><a href="javascript:GotoPage(1);">First</a></td>';
 $prev = '<td><a href="javascript:GotoPage(' . ($selected_page - 1) . ');">Prev</a></td>';
 }

 if($selected_page < $number_of_pages && $number_of_pages > 1) {
 $last = "<td><a href='javascript:GotoPage($number_of_pages);'>Last</a></td>";
 $next = '<td><a href="javascript:GotoPage(' . ($selected_page + 1) . ');">Next</a></td>';
}

for ( $counter = $min_page_number ; $counter <= $max_page_number; $counter += 1) {

 $style = '';

 if($selected_page == $counter)
 {
 $style = 'style="color: red; background-color: #000000; font-color:white"';
 }

 $pages .= "<td $style><a href='javascript:GotoPage($counter);'>$counter</a></td>";
}

 $info .= "Total Records = $records_count";
 $info .= '<br/>';
 $info .= "Number of pages = $number_of_pages";
 $info .= '<br/>';
 $info .= "Selected Page = $selected_page";
 $info .= '<br/>';
 $info .= "Min Page Index = $min_page_number";
 $info .= '<br/>';
 $info .= "Max Page Index = $max_page_number";
 $info .= '<br/>';
 $info .= "Records per page = $records_per_page";

 return "<div id='divForm'>$info<table border='1' bgcolor='#CCCCFF' width='100%'><tr><td width='100%'>&nbsp;</td>$first$prev$pages$next$last$goto</tr></table></div>";
}

echo get_paging(6000,10);

?>



author's photo

Author : Blue Cloud

Just a normal software developer who love to write code. Developing professional software since 1999. After working in the software industry for many years, I've started my own website to share knowledges and experiences.

COMMENTS
blog comments powered by Disqus