Ajax WordPress Pagination does not Work

  • Resolved [email protected]

    (@soumyaunknowngmailcom)


    11 years, 5 months ago

    Hello
    I am looking for : Ajax WordPress Pagination

    I have added below code in index.php

    <ul id='PaginationExample'>
  <li><?php next_posts_link('&laquo; Older Entries') ?></li>
  <li><?php previous_posts_link('Newer Entries &raquo;') ?></li>
  </ul>

    And also added below JS on header.php

    <script type="text/javascript" charset="utf-8">
jQuery(document).ready(function(){
jQuery('#PaginationExample a').live('click', function(e){
  e.preventDefault();
  var link = jQuery(this).attr('href');
  jQuery('#contentWrap').html('Loading...');
  jQuery('#contentWrap').load(link+' #content');  

  });  

  });
  </script><p></p>

    My Index div Structure

    <?php get_header(); ?>
<div id="contentWrap">
<div id="content">

    where div#content containing only main Contents (excluding any type of sidebar etc)

    PS: I am new in JQuery

    It seems does not work,page are still loading with Refresh.

    Whats wrong with my code?

    Any Solution?

    Thank you

Viewing 3 replies - 1 through 3 (of 3 total)

  • Hey,

    In your code, you’re calling #contentWrap where you should be calling #content

    Ammending your jQuery snippet accordingly would leave it as:

    <script type="text/javascript" charset="utf-8">
jQuery(document).ready(function(){
jQuery('#PaginationExample a').live('click', function(e){
  e.preventDefault();
  var link = jQuery(this).attr('href');
  jQuery('#content').html('Loading...');
  jQuery('#content').load(link+' #content');  

  });  

  });
</script>

    Additionally, please ensure that this snippet comes after the <?php wp_head(); ?> hook, else jQuery will be loaded after your script and it will not work at all.

    Let me know if this works!

    Thread Starter [email protected]

    (@soumyaunknowngmailcom)

    yes that’s my mistake
    forgot to change the target :p

    Thank you

    No problem. ??

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Ajax WordPress Pagination does not Work’ is closed to new replies.