Paginated Navigation Bar

One area of web programming that many of us have frequently run into is the need to show a long list of items (whether database results or whatever) in a nicely formatted, easily navigable way.  Usually making the list user friendly involves creating some sort of paging system which allows the user to view various pages of results.  Unfortunately coding such a beast can quickly get ugly.

The following function will (hopefully) help you to make that process easier.  The function is designed to take a few input parameters such as the total number of results, and how many you want to display per page, and create a simple paged navigation bar for you.

<?php

/**
 * Get a paginated navigation bar
 *
 * This function will create and return the HTML for a paginated navigation bar
 * based on the total number of results passed in $num_results, and the value
 * found in $_GET['pageNumber'].  The programmer simply needs to call this function
 * with the appropriate value in $num_results, and use the value in $_GET['pageNumber']
 * to determine which results should be shown.
 * Creates a list of pages in the form of:
 * 1 .. 5 6 7 .. 50 51 .. 100
 * (in this case, you would be viewing page 6)
 *
 * Code taken from http://www.warkensoft.com/2009/12/paginated-navigation-bar/
 *
 * @global    int        $_GET['pageNumber'] is the current page of results being displayed.
 * @param    int     $num_results is the total number of results to be paged through.
 * @param    int     $num_per_page is the number of results to be shown per page.
 * @param    bool    $show set to true to write output to browser.
 *
 * @return    string    Returns the HTML code to display the nav bar.
 *
 */
function get_paged_nav($num_results, $num_per_page=10, $show=false)
{
 // Set this value to true if you want all pages to be shown,
 // otherwise the page list will be shortened.
 $full_page_list = false; 

 // Get the original URL from the server.
 $url = $_SERVER['REQUEST_URI'];

 // Initialize the output string.
 $output = '';

 // Remove query vars from the original URL.
 if(preg_match('#^([^\?]+)(.*)$#isu', $url, $regs))
 $url = $regs[1];

 // Shorten the get variable.
 $q = $_GET;

 // Determine which page we're on, or set to the first page.
 if(isset($q['pageNumber']) AND is_numeric($q['pageNumber'])) $page = $q['pageNumber'];
 else $page = 1;

 // Determine the total number of pages to be shown.
 $total_pages = ceil($num_results / $num_per_page);

 // Begin to loop through the pages creating the HTML code.
 for($i=1; $i<=$total_pages; $i++)
 {
 // Assign a new page number value to the pageNumber query variable.
 $q['pageNumber'] = $i;

 // Initialize a new array for storage of the query variables.
 $tmp = array();
 foreach($q as $key=>$value)
 $tmp[] = "$key=$value";

 // Create a new query string for the URL of the page to look at.
 $qvars = implode("&amp;", $tmp);

 // Create the new URL for this page.
 $new_url = $url . '?' . $qvars;

 // Determine whether or not we're looking at this page.
 if($i != $page)
 {
 // Determine whether or not the page is worth showing a link for.
 // Allows us to shorten the list of pages.
 if($full_page_list == true
 OR $i == $page-1
 OR $i == $page+1
 OR $i == 1
 OR $i == $total_pages
 OR $i == floor($total_pages/2)
 OR $i == floor($total_pages/2)+1
 )
 {
 $output .= "<a href='$new_url'>$i</a> ";
 }
 else
 $output .= '. ';
 }
 else
 {
 // This is the page we're looking at.
 $output .= "<strong>$i</strong> ";
 }
 }

 // Remove extra dots from the list of pages, allowing it to be shortened.
 $output = ereg_replace('(\. ){2,}', ' .. ', $output);

 // Determine whether to show the HTML, or just return it.
 if($show) echo $output;

 return($output);
}

// Sample usage
$total_results = 100;
$results_per_page = 5;
$html = get_paged_nav($total_results, $results_per_page, false);
echo 'Page: ', $html;

?>

Here is a screenshot of what the output of the function looks like. You can of course format this to look however you want with CSS.

Screenshot of function output

Screenshot of function output

If you find this to be useful you’re welcome to download it.  The code is free to use and if you’re really nice you’ll link back to me or digg it. (see the share and save controls under the post title.

If you have thoughts, comments or suggestions on how to improve it, I’d love to hear them in the comments below.

PHP Function to Convert LineBreaks to NewLines

While PHP has a very nice little function (nl2br) to convert newlines (\n) to line breaks (<br>), moving in the opposite direction is not quite so easy. This function should hopefully help to allow you to convert line breaks to new lines.

<?php

/* This function will convert line breaks or other tags passed in the $tags variable
to linebreaks.  Multiple $tags must be separated by spaces, and must consist of the
regular tag text.  Ie. $result = br2nl($text_to_filter, "br p blockquote") */
function br2nl($text, $tags = "br")
{
 $tags = explode(" ", $tags);

 foreach($tags as $tag)
 {
 $text = eregi_replace("<" . $tag . "[^>]*>", "\n", $text);
 $text = eregi_replace("</" . $tag . "[^>]*>", "\n", $text);
 }

 return($text);
}

// Usage:
 $text_to_filter = "<p>This is my <br>sample<br>text.  The default code listed here " .
"should replace the br's with new lines.</p><p>The second example is more advanced, " .
"stripping out both the BR's as well as the P tags.</p>";

 // Example of replacing BR tags (default)
 $result = br2nl($text_to_filter);
 echo "<pre>$result</pre>";

 // Example of replacing both BR and P tags
 $result = br2nl($text_to_filter, "br p");
 echo "<pre>$result</pre>";

?>



Other Information:

Programming Related

Articles we've written related to the topic of PHP Programming.


Website Development Tips

Tips and strategies related to the development of great websites.


General Information & Resources

General information and resources from WarkenSoft Productions.