Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
BedrockMission!

Learn more

View all

Sign in to view all badges

SOLVED

AEM 6.5 : add pagination to list

manal-ghanim
Level 2
Level 2

Hi,

We are implementing a complex list that shows elements with a title, a description, an image and a link. I would like to know what is he best way to implement pagination using only frontend logic ?

Thanks,

1 Accepted Solution
Arun_Patidar
Correct answer by
Community Advisor
Community Advisor

Hi,

We have implemneted the list component with pagination, which get the child pages title, description and image and create a list item with a link.

we created a json service and servlet, which return relavent results based on paginagion, you can pass page number in the json request when click on paginations and get the pagination results at front end side and create a result DOM based on json response, you can use the Query Builder API which support the pagination properties if running queries to fetch pages title, description etc..

View solution in original post

4 Replies
Arun_Patidar
Correct answer by
Community Advisor
Community Advisor

Hi,

We have implemneted the list component with pagination, which get the child pages title, description and image and create a list item with a link.

we created a json service and servlet, which return relavent results based on paginagion, you can pass page number in the json request when click on paginations and get the pagination results at front end side and create a result DOM based on json response, you can use the Query Builder API which support the pagination properties if running queries to fetch pages title, description etc..

View solution in original post

Umesh_Thakur
Community Advisor
Community Advisor

@manal-ghanim , you can use pagination from the front-end purely. We had  implemented it with the help of one open source JS library named Data tables.

It is pretty much easy to use.

More details you can get it on below urls:

https://datatables.net/

 

Hope this will help.

Umesh Thakur

manal-ghanim
Level 2
Level 2
@Umesh_Thakur, does datable have an option to display complex data instead of tabular info ? Basically, I wish to render AEM list items and apply paging.
Umesh_Thakur
Community Advisor
Community Advisor
If was able to populate list of JOSN object into it then you can too. It seems it is doable with that.