Pagination in lightning component using server-side controller :-

Salesforce Lightning Component:-

A new UI framework, Salesforce Lightning Component accelerated the development and app performance. Use to develop a single page web applications for mobile and desktop devices, it offers responsive user interfaces and uses JavaScript and Apex on the client and server side respectively. It helps in developing custom components that can be reused as building blocks for communities, mobile apps running on Salesforce and Lightning experience seamlessly.

 

With API version 45.0, the Lightning components can be build using two programming models: –

  • Lightning Web Components model
  • Original Aura Components model.

Creating Pagination in Lightning Component:-

Pagination helps in delivering the needed result to the user in sets or chunks and not the entire data. The implementation of Pagination in Lightening Component can be done in two ways:

 

  • Using Server Side Controller Call for every page.
  • Using Client Side Controller Call for every page by fetching data all at once.

This article shares an example on creating pagination in lightning component using server side controller.

Few points that need to incorporate while pagination with the server side controller are as follows:-

  • Load the data from the server in pieces with the queries to fetch X number of records at a time.
  • Use LIMIT (limit the result page) and OFFSET (skips the results that will not show) in the SOQL query
  • Make server side calls to retrieve the data for every page.
  • Show total page count and total record count.
  • Use “(cacheable=true)” annotation (caches the data on client side) in the apex class to make component performance faster.

For Live Demo Click here

Step 1: - Create Apex Class Controller [AccountPagination]

Step 2: - Create Lightning Component [Pagination_Example.cmp]

Step 3 – JS Controller [Pagination_ExampleController.js]

Step 4 – JS Helper [Pagination_ExampleHelper.js]

Step 5: - lightning App [Pagination_ExampleApp]

Support:

Above was an example on creating pagination in Salesforce lightning component using server side controller. For further queries or assistance regarding your Salesforce apps and lighting experience, please feel free to reach out to us on +1(415) 992-6421 or drop us a mail at sales@hicglobalsolutions.com.

Our Location worldwide
India
3rd Floor, A-10, Pegasus Tower, Sector 68, Noida, Uttar Pradesh 201301 +91-1203117884
SR Tower 2nd Floor Hydel Gate Haldwani Uttarakhand 263126 +91-5946359996
USA
333 West Brown Deer Road Unit G – 366 Milwaukee WI, USA 53217 +1(262) 310-7818
UK
7 Bell Yard, London, WC2A 2JR +44 20 3239 9428
Canada
HIC Global Solutions INC
43 Lafferty Lane, Richmond Hill, L4C 3N8, CA +1(262) 310-7818