What is the best way to implement ajax based pagination on custom query based templates?

admin管理员组

文章数量:1334167

We can use multiple plugins like wp-pagenavi or wp-paginate for implementing pagination for wordpress sites and making it ajax based using the following code:

jQuery(document).ready(function(){
    // ajax pagination
    jQuery('#wp_page_numbers a').live('click', function(){ 

        var link = jQuery(this).attr('href');                   
        jQuery('#main').html('Loading'); 
        jQuery('#main').load(link+' #entries')
    });
}); // end ready function

Sometimes, there are some cases where we want to display results based on custom query (i.e fetching results from the tables other than wordpress default tables) on a page template.

What is the best way for implementing pagination in this case?

We can use multiple plugins like wp-pagenavi or wp-paginate for implementing pagination for wordpress sites and making it ajax based using the following code:

jQuery(document).ready(function(){
    // ajax pagination
    jQuery('#wp_page_numbers a').live('click', function(){ 

        var link = jQuery(this).attr('href');                   
        jQuery('#main').html('Loading'); 
        jQuery('#main').load(link+' #entries')
    });
}); // end ready function

Sometimes, there are some cases where we want to display results based on custom query (i.e fetching results from the tables other than wordpress default tables) on a page template.

What is the best way for implementing pagination in this case?

• pagination
• ajax

Share Improve this question edited Sep 28, 2012 at 17:45 Rarst 100k1010 gold badges161161 silver badges298298 bronze badges asked Sep 28, 2012 at 17:39 swtshwetaswtshweta 43266 silver badges1616 bronze badges

Add a comment  | 

2 Answers 2

Sorted by: Reset to default 1

Soumitra Chakraborty wrote a very good tutorial on Getting Started with AJAX & WordPress Pagination. I would recommend following that pattern (in terms of how to use admin_ajax.php in conjunction with your functions.php.

That tutorial will give you a great framework for how to implement ajax pagination by hand.

In terms of your own specific requirements for a custom query (which it sounds like might involve getting data from non-standard tables) you can use the WP_Query class to do some pretty advanced stuff (like what you describe) in your custom function that you define in functions.php.

I have just find a simple solution where I have tried several "advanced" and modern frameworks, but old reliable jquery make it simple.

$(document).ready(function(){
// ajax pagination

$('#paginator a').on('click', function(e){ 
    e.preventDefault();
    console.log('paginate');
    var link = $(this).attr('href');
    $('.current').removeClass('current');
    $(this).addClass('current');
    $('#main-content').html('Loading');

    $('#blog').load(link+' #main-content');
    $('#paginator').load(link+' .pagination') 
});

});

I just add some minor variations in order to update the post grid, in my case main content. and pagination status in my case #pagination. Both with an inner div to just update what is being modified.

本文标签： What is the best way to implement ajax based pagination on custom query based templates