#community-help

Troubleshooting Pagination Issues in CMS Plone Site with Typesense Integration

TLDR A had an issue with pagination on their Plone CMS website integrated with Typesense. Jason suggested various troubleshooting techniques, including updating the Instantsearch.js version and modifying the pagination widget. Pagination eventually worked, although leaving href="#".

Powered by Struct AI
20
21mo
Solved
Join the chat
Jan 25, 2022 (21 months ago)
A
Photo of md5-fe034fbff44e9cae037b7bb23a5080c4
A
04:47 PM
Hi there, I have the case where the pagination is not working on my CMS Plone site with my own Typesense integration…everything is working, clicking on a pagination link just jumps to the top of the page: http://dev2.zopyx.de:8081/Plone/typesense-search - any ideas?
Jason
Photo of md5-8813087cccc512313602b6d9f9ece19f
Jason
04:52 PM
A Somehow the pagination widget is not rendering the links... Could you share the instantsearch widget configuration code?
04:53
Jason
04:53 PM
I wonder if the pagination widget is not nested inside the instantsearch context...
Jason
Photo of md5-8813087cccc512313602b6d9f9ece19f
Jason
05:17 PM
That seems ok to me... I wonder if this is a version issue. Could you try with the latest version of Instantsearch.js?
Jason
Photo of md5-8813087cccc512313602b6d9f9ece19f
Jason
05:23 PM
Hmm very strange. The only other explanation is that something else is interfering with the pagination. To confirm this theory, could you clone the typesense ecommerce demo repo, and swap out all the widgets to use your index and widget settings, and see if the pagination issue still manifests there?
A
Photo of md5-fe034fbff44e9cae037b7bb23a5080c4
A
05:25 PM
i will try (not today)
05:26
A
05:26 PM
There is possibly some interfering with the JS stuff of the CMS…but that’s beyond my knowhow in Plone:)
Jason
Photo of md5-8813087cccc512313602b6d9f9ece19f
Jason
05:26 PM
May be try changing the ID of the pagination div to something else?
05:28
Jason
05:28 PM
Also, I wonder if any of the classes you've used under cssClasses for the pagination widget trigger some special behavior in the CMS JS?
A
Photo of md5-fe034fbff44e9cae037b7bb23a5080c4
A
06:03 PM
Changing the ID does not help, The CSS classes are unique to TS. And when I look at the event handlers for click for all A elements, they are linked to some TS code.
Jason
Photo of md5-8813087cccc512313602b6d9f9ece19f
Jason
06:04 PM
It's not the click handlers... I see that the "href" attribute itself is replaced with "#" instead of the actual links to next pages
A
Photo of md5-fe034fbff44e9cae037b7bb23a5080c4
A
06:41 PM
true
06:50
A
06:50 PM
Rendering a bare template without the JS/CSS from Plone, it looks a bit better. The pagination seems to work. However, still href=“’#” : http://dev2.zopyx.de:8081/Plone/typesense-search2
Jason
Photo of md5-8813087cccc512313602b6d9f9ece19f
Jason
07:54 PM
I see this error when loading the page
Jan 26, 2022 (21 months ago)
A
Photo of md5-fe034fbff44e9cae037b7bb23a5080c4
A
11:34 AM
sorry, fixed this for the raw template view
11:37
A
11:37 AM
Actually, now the pagination is working on http://dev2.zopyx.de:8081/Plone/typesense-search - href=“#” is still present, so the page jumps always to the head
Jason
Photo of md5-8813087cccc512313602b6d9f9ece19f
Jason
02:10 PM
Oh nice, how did you get it to work?!

Also the scroll behavior can be controlled using the scrollTo param: https://www.algolia.com/doc/api-reference/widgets/pagination/js/#widget-param-scrollto