Hiding pagination when there’s one page of results — solution stopped working

Attributes
1

Description

Hi—

I originally contacted you in October looking for help with a script to hide the pagination number 1 when there’s only one page of results. The script you provided worked perfectly. I was so happy!

It suddenly stopped working, and I can’t figure out why.

I added a comment to my original post a few days ago, and sent a DM, but am now posting as a new comment in case that wasn’t seen.

I can provide details by DM.

Thanks!!

NDA Notice: If you’re under an NDA, please feel free to send us a Direct Message/Email with the above information.

2

Hey @EllenG!

That’s definitely frustrating when a working script suddenly stops functioning

To help diagnose what changed, could you share your read-only Webflow staging link

Once we see your site structure, we can better determine if this is related to a Webflow update or something specific to your implementation.

3

Hi Jesse— It’s better I reply by DM. I sent you a message. Thanks!

4

If the info needs to go somewhere else, please let me know. (I’m still figuring things out here!) I’m feeling a little desperate to get this fixed again. Much appreciate any help anyone can give me! Thanks!!

5

This was sorted out in the DMs

There seems to be a race condition affecting the cdn script & the previous fix

Ended up going with this solution

<style>
.w-pagination-wrapper.hidden {
  display: none!important;
}
</style>

<script>
!function() {
  const targetNode = document.querySelector('.w-dyn-list[fs-list-element]');
  const observer = new MutationObserver((mutationList, observer) => {
  for (const mutation of mutationList) {
    if (mutation.type === 'childList' || mutation.type === 'subtree') {
      const pageButtons = [...document.querySelectorAll('[fs-list-element="page-button"]')];
      if (!pageButtons.length) return; 
      const numericCount = pageButtons
       .map(b => b.textContent.trim())
       .filter(t => /^\d+$/.test(t)).length;
      
      const $paginationWrapper = targetNode.querySelector('.w-pagination-wrapper');
      if (numericCount > 1) {
        $paginationWrapper.classList.remove('hidden');
      }
      else {
        $paginationWrapper.classList.add('hidden');
      }
    }
  }
  });
  observer.observe(targetNode, { childList: true, subtree: true });
}();
</script>
1 Like