Add active class for ajax pagination

Anonymous

#223717

My numeric pagination is not working properly with ajax search and filter. It properly changes the page, but search and filter does not add any active or current class to the link so that I can properly highlight the link. As a result, page 1 remains highlighted regardless of which page you’re on, as that one still has the active class from the initial page load.

Is there a way to change the active class when paginating through Search and Filter? Thanks!

Trevor

#223777

Is this the same site as the previous thread (that I just closed)? The Insights page? I went to Page 3 and it shows this HTML:

<li class="page-item active">
  <span aria-current="page" class="page-link current">3</span>                
</li>

Anonymous

#223812

Yes that same page, but it only works if you use pagination before filtering. If you go to the page, filter something, then paginate through the results, the active class doesn’t change.

Anonymous

#223831

I’m realizing the issue isn’t just the active class — it’s not changing the page at all when you try to navigate through the filtered results. There’s just a fade as if it were changing, but nothing happens. If I turn off bookmarable searching, then the pagination works again, but it’s not paginating the results, it’s just paginating the full blog (insights).

I have the search settings to show 12 results per page, but there are more than 12 results for each category, so I need to be able to paginate the results. Are you able to see what’s going wrong here?

The pagination is built using wp_paginate_links().

Anonymous

#223835

More information…. when I added a custom slug to the search and filter settings, as opposed to ?sfid=XXX, the pagination correctly changed to show the next set of results again.

However the problem remains that 1) it does not change the current class when changing pages and 2) it does not show the correct number of pages. It always shows 23 pages (total regardless of filtered results).

Trevor

#224001

This reply has been marked as private.

Anonymous

#224038

This reply has been marked as private.

Anonymous

#224045

This reply has been marked as private.

Anonymous

#224047

Should clarify I also tried it with just regular posts_nav_link() function for previous/next links vs number pagination, and I get a similar issue. It navigates through the filtered results and then keeps showing a “Next page” link because it thinks there are 23 pages of results, even though there are only 2 pages of actual results. It does this with the number pagination as well. It shows you all 23 numbers regardless of how many filtered results there are, and it shows you a ‘no results’ error when you navigate beyond that page.

Anonymous

#224238

Update: I was able to resolve this. The issue was with the location of the pagination function in the page template. I had it after the endif in the main query, and it needed to be inside it, apparently. Thanks!

[Author]

Posts