Pagination order bug

Has anyone run across a bug with the pagination where the next arrow can show up in the middle of the page options?

This always happens, with these steps:

  • Click on a page far ahead enough to make page 1 disappear (in my case page 4).
  • Then click on an earlier page, for example page 3.

These are my pagination options:

	container: "#pagination",
	showFirst: false,
	showLast: false,
	padding: 2,
	templates: {
		previous: '',
		next: ''
1 Like


Could you create a minimal reproducible example to help us better understand the problem?

We provide a CodeSandbox template to avoid spending time setting up the environment.

I’ve got the same issue. In some situation, the previous and next LI are inserted at the beginning of the pagination list, or at the wrong position.

To reproduce :

  • Click on any page number higher than 5
  • Then click on another page number :
    • It’s working fine if you go to a page higher than current page
    • But if the clicked page number is is below 5, the display is not correct.


1 Like

Hello @daniel3 and @blomki
I can’t reproduce the issue.

Can you update the sandbox for reproduction?

I wasn’t able to reproduce the bug in the sandbox using my algolia configuration settings. I didn’t have much time to work on it, so I simply solved it visually with flexbox order. For reference, my site is statically generated Vue/Nuxt, using the JS Algolia.

The DOM output from the pagination widget is correct and haven’t heard of such issue so far. I assume there must be some bug regarding the custom styles you have. Glad to hear you sorted it out.
Let me know if you have any question.

I’ve got the same issue. It shows correct results but it keeps showing the first page as current, and mixed-up buttons for navigation.

Screen Shot 2021-04-08 at 2.14.05 PM