Implementing pagination for displaying records with navigation button

Question

Hi, 
 
 I'm currently working on an interface where I display data queried from a record type and store it in a local variable. I'm then looping through this local variable to display the content 
 Now I would like to modify my expression so that it only shows 5 records at a time, with next and back navigation buttons to show next set of records, similar to the functionality in a read-only grid. Can anyone please guide me how to achieve this?

Shantanu Joshi · Accepted Answer

Thanks Kumar Agniwesh , 
 I have implemented similar kind of approach. Sharing the code below for future reference to any community member. a!localVariables(
 local!currentPage: 1,
 /*desired batch size*/
 local!batchSize: 5, 
 local!pagingInfo: a!pagingInfo(
 startIndex: 1,
 batchSize: local!batchSize
 ),
 local!Data: recordType!(pagingInfo: local!pagingInfo),
 {
 a!sectionLayout(
 label: "",
 contents: {
 a!forEach(
 items: local!Data.data,
 expression: {
 /*Content*/
 }
 )
 },
 divider: "ABOVE",
 dividerWeight: "THIN"
 ),
 a!richTextDisplayField(
 labelPosition: "COLLAPSED",
 value: {
 a!richTextIcon(
 icon: "angle-double-left-bold",
 caption: "First",
 color: if(
 local!pagingInfo.startIndex > 1,
 "ACCENT",
 "SECONDARY"
 ),
 link: a!dynamicLink(
 saveInto: {
 a!save(
 local!pagingInfo.startIndex,
 1
 ),
 a!save(
 local!currentPage,
 1
 )
 },
 showWhen: local!pagingInfo.startIndex > 1
 ),
 linkStyle: "STANDALONE"
 ),
 a!richTextIcon(
 icon: "angle-left-bold",
 altText: "Previous Page",
 caption: "Previous",
 color: if(
 local!pagingInfo.startIndex > 1,
 "ACCENT",
 "SECONDARY"
 ),
 link: a!dynamicLink(
 saveInto: {
 a!save(
 local!pagingInfo.startIndex,
 if(
 local!pagingInfo.startIndex - local!batchSize < 1,
 1,
 local!pagingInfo.startIndex - local!batchSize
 )
 ),
 a!save(
 local!currentPage,
 local!currentPage-1
 )
 },
 showWhen: local!pagingInfo.startIndex > 1
 ),
 linkStyle: "STANDALONE"
 ),
 a!richTextItem(
 text: concat(" ",local!currentPage, " "),
 ),
 a!richTextIcon(
 icon: "angle-right-bold",
 altText: "Next Page",
 caption: "Next",
 color: if(
 ceiling(local!pagingInfo.startIndex/local!batchSize) = ceiling(local!Data.totalCount/local!batchSize),
 "SECONDARY",
 "ACCENT"
 ),
 link: a!dynamicLink(
 saveInto: {
 a!save(
 local!pagingInfo.startIndex,
 local!pagingInfo.startIndex + local!batchSize
 ),
 a!save(
 local!currentPage,
 local!currentPage + 1
 )
 },
 showWhen: not(ceiling(local!pagingInfo.startIndex/local!batchSize) = ceiling(local!Data.totalCount/local!batchSize))
 ),
 linkStyle: "STANDALONE"
 ),
 a!richTextIcon(
 icon: "angle-double-right-bold",
 caption: "Last",
 color: if(
 ceiling(local!pagingInfo.startIndex/local!batchSize) = ceiling(local!Data.totalCount/local!batchSize),
 "SECONDARY",
 "ACCENT"
 ),
 link: a!dynamicLink(
 saveInto: {
 a!save(
 local!pagingInfo.startIndex,
 if(
 local!Data.totalCount - mod(local!Data.totalCount, local!batchSize) = 0,
 local!Data.totalCount - local!batchSize + 1,
 local!Data.totalCount - mod(local!Data.totalCount, local!batchSize) + 1
 )
 ),
 a!save(
 local!currentPage,
 ceiling(local!Data.totalCount/local!batchSize)
 )
 },
 showWhen: not(ceiling(local!pagingInfo.startIndex/local!batchSize) = ceiling(local!Data.totalCount/local!batchSize))
 ),
 linkStyle: "STANDALONE"
 )
 },
 align: "RIGHT"
 )
 }
) 
 
 Result Image:

Soma · Answer

What is the use case for this approach. Is for editable grid or readonly grid? 
 If you want to just display the data from the record type in the readonly grid, you can simply select the record type as data source. 
 Else you need to have custom pagination

Implementing pagination for displaying records with navigation button

Top Replies