Pagination within load more

Kirby 3 Questions 🤔
1

I have implemented pagination like this:
image

I tried load more articles within https://infinite-scroll.com/ library, but I don’t know how to update pagination component (current page, hellips etc.)

Is it possible only with Kirby? Any suggestions welcome.

Thanks a lot

2

Kirby’s code happens on the server and the server knows nothing of what you do on the client side with your JavaScript unless you make an Ajax call to tell your server that you want something else now. So you’d have to update your pagination via an Ajax call to the server or do it all on the frontend.

But somehow that looks a bit “doppelt gemoppelt” (redundant) to me, using a pagination and the load more button that are both supposed to do the same thing, right?

1 Like
3

I don’t know what is “doppelt gemoppelt” :slight_smile: but pagination reload the page and load more button only append posts from next page without reloading and update pagination. So from UX perspective is not exactly same.

Can I use only Kirby Ajax and controller for this functionalities?

4

Yes, sure, but the technical difference is not interesting for the user and only confusing, I think. If it was my site, I’d use progressive enhancement on the pagination and load the next page via Ajax (i.e. without a page reload) if JS is available, without the additional button.

5

And how Can I implement this, is there some tutorial? Classic pagination with Ajax loading support?

6

There is no specific Kirby tutorial for this, but regarding the Ajax stuff, there are two tutorials in the Kirby 2 cookbook, the rest you can find using Google. Basically, it is nothing but a normal page load via Ajax using the History Api to make the back/next browser buttons work. There’s also a thread here in the forum somewhere with the history Api, you should be able to find this using search.