2

I'm using ajax-based pagination, heres the markup

<div id="portfolio-thumbs">
        <ul id="portfolio-destaque">
     HERE GOES MY LOOP AND CONTENT , some LI's with thumbs and stuff   
                        </ul></div>
                <div id="pagi-container">
                    <div id="paginar">
        <?php posts_nav_link(); ?>  
            </div>
</div>

then, i use this jquery so it loads content inside #portfolio-thumbs and pagination links inside #pagi-container:

  $('#paginar > a').on('click',  function(e){
        e.preventDefault();
        var link = jQuery(this).attr('href');
        jQuery('#portfolio-thumbs').html('Loading...');
        jQuery('#portfolio-thumbs').load(link+' #portfolio-destaque');
        jQuery('#pagi-container').load(link+' #paginar');

    });

Well, when i click > Next Page for the first time:

  • it loads page/2 ok, inside #portfolio-thumbs goes the looped posts and the markup stays the same
  • except for the < previous page link that is added inside #pagi-container

  • If I click again, the jquery/ajax does not work, and loads full page/3, reloading browser's window.. If, in page/3 I click <previous page or > next-page ajax works ok again.... Any ideas what i'm doing wrong?

    1 Answer 1

    2

    @kennypu in stackoverflow saved my life with this:

    t's because you're changing the contents of #paginar, so what happens is the event on the links are getting cleared. depending on your jquery version, you can either use .live() or add the even to the #pagi-container instead:

    $('#pagi-container').on('click','#paginar > a',function() {... }
    

    my finished code is like this:

      $('#pagi-container').on('click','#paginar > a',function(e) {
            e.preventDefault();
            var link = jQuery(this).attr('href');
            $('#portfolio-thumbs').html('Aguarde, por favor...');
            $('#portfolio-thumbs').load(link+' #portfolio-destaque');
            $('#pagi-container').load(link+' #paginar');
    
        });
    

    thanks kennypu!

    Your Answer

    By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

    Not the answer you're looking for? Browse other questions tagged or ask your own question.