JS increment for next & prev links

JavaScript
1

Instead of a navigation menu, my client would like to show NEXT and PREV links to click through the site’s pages. Something like this:

<div id="prevnext">
    <ul>
        <li class="next"><a href="page-3.php">NEXT</a></li>
        <li class="prev"><a href="page-1.php">PREV</a></li>
    <.ul>
</div>

I’m loading the page content using AJAX and a jQuery fade in and out. But the NEXT and PREV links need to be in the footer.php and be incrementing after a new page is loaded. The script looks like this:

var $mainContent = $('#main-content'),
newHash = '';

$("#prevnext").delegate("a", "click", function() {
    window.location.hash = $(this).attr("href");
    return false;
});
	
$(window).bind('hashchange', function() {
									  
    newHash = window.location.hash.substring(1);
							  
    if (newHash) {
        $mainContent
            .find("#content")
            .fadeOut(600, function() {
                $mainContent.hide().load(newHash + " #content", function() {
                    $mainContent.fadeIn(600);				  
		});
            });
    };
										  
});

$(window).trigger('hashchange');

My pages could be named page-1.php, page-2.php and so on. That works for me. I’m looking for a way to update and increment the NEXT and PREV links after each click. I would add the increment using PHP, but since I’m loading the pages with AJAX, the page is not refreshing.

I would also like to hide the PREV link if there is no page to show, and hide the NEXT link if we’re at the end of the list.

2

If you know how many pages there are you can insert the html links in either php or javascript. Much better than processing it on each click - imo

3

One solution is:

  1. At the top of each page-x.php page have a session variable that updates and stores the current web page number.

  2. When the ajax request is sent with the prev/next link’s current href value, the page-x.php increments the session variable according to whether next or prev link was clicked and then loads page-x.php.

  3. page-x.php then sends back to the browser (via the ajax request) the updated href values according to the incremented session variable value for the next/prev links.

4

My page are built in PHP, calling a header.php, the page content (page-1.php), and then calling footer.php. The header and footer are not refreshing, and the content from the pages are being called and loaded by AJAX on click.

I do know how many pages there are, but I don’t understand what you mean about inserting the HTML links.