Pagination In PowerApps With SharePoint

Introduction

In this article, we will see how we can implement pagination in PowerApps with SharePoint as data source. We are using Power Automate to manipulate all data fetching functionality. Also, we are using new upcoming feature of ParseJSON.

First, let me tell you that what I had in backend SharePoint list,

I have created one PowerAutomate that takes parameters as No of records per page and Next or Previous, and then it gets records from SharePoint list and returns records in JSON format to PowerApps. Below is the screenshot of PowerAutomate which you need to focus on to understand in detail, also I have attached full source code which includes the PowerApps and PowerAutomate.

PowerApps

At PowerApps side we have taken Gallery to show data coming from Power Automate,

When Page loads we have loaded initial data using below code,

Set(
    ParsedData,
    ParseJSON(
        ReturnJSONString.Run(
            0,
            Dropdown1.Selected.Value,
            ""
        ).jsonstring
    )
);
Select('Reusable Logic');

Reusable Logic button called each time as it converts Parsed Data to typed Data like below

ClearCollect(
    ParsedCollection,
    ForAll(
        Table(ParsedData),
        {
            ID: Value(Value.ID),
            Name: Text(Value.Name),
            Gender: Text(Value.Gender.Value),
            DateOfBirth: DateValue(Value.DateOfBirth),
            Age: Value(Value.Age),
            IsActive: Boolean(Value.IsActive),
            Author: {
                Claims: Text(Value.Author.Claims),
                DisplayName: Text(Value.Author.DisplayName),
                Email: Text(Value.Author.Email),
                Picture: Text(Value.Author.Picture),
                Department: Text(Value.Author.Department),
                JobTitle: Text(Value.Author.JobTitle)
            }
        }
    )
)

Logic of Next button

Set(
    ParsedData,
    ParseJSON(
        ReturnJSONString.Run(
            Last(ParsedCollection).ID,
            Dropdown1.Selected.Value,
            "Next"
        ).jsonstring
    )
);
Select('Reusable Logic');

Logic of Prev button

Set(
    ParsedData,
    ParseJSON(
        ReturnJSONString.Run(
            First(ParsedCollection).ID,
            Dropdown1.Selected.Value,
            "Prev"
        ).jsonstring
    )
);
Select('Reusable Logic');

Logic on Change event of number of records per page dropdown

Set(
    ParsedData,
    ParseJSON(
        ReturnJSONString.Run(
            First(ParsedCollection).ID,
            Dropdown1.Selected.Value,
            "NoOfRecordsChanged"
        ).jsonstring
    )
);
Select('Reusable Logic');

That's it. we are good to go. You can try this example by downloading source code that I have attached and enhance the logic with search and sort, please comment if you make some enhancements.