Scolldown Pagination in Visualforce Page

First of all, most important thing to know what is pagination?

Why we use it???

Most of the developers know about this but if you are beginner or do not know about pagination here is the explanation.

Pagination is used to display or handle the large number of sobject records and breaking the large number of records into the separate pages for viewing with in the salesforce so that you can improve the visualforce page or lightning component load times.

Pagination can be done using multiple ways.

  1. Pagination with a Standard Set Controller
  2. Pagination with a SOQL OFFSET in Apex

If you are dealing with limited records like upto 2,000 then you can use SOQL Offset in custom controller and display in visualforce using next and previous buttons or scrollbar.

But if you have requirement for more than 2,000 records then you can use Standard Set Controller and paginate records upto 10,000.

You can set any number of sobject records like 20,25 or any other number per page with the help of pagination.

In the article I am going to explain pagination using SOQL Offset in custom apex controller and display records in visualforce with the help of visualforce remoting and jquery.

This will also help you to understand some basic concepts of visualforce remoting and jquery.

So we have talked too much now It’s time for some code.


As you can see 15 Account (sobject) records per page is displaying using SOQL Offset.

Some pointers related to above visualforce page and apex controller which  would be helpful to understand.

  1. getAccountsData() is the javascript function which is calling initially on load of page for getting first 15 records or when user reaches the end of page for getting the further 15 records from server side.
  2. scrollTop() is the javascript property which returns the number of pixels an element content is scrolled vertically.
  3. innerHeight() is the javascript property which returns the height of window’s content area.
  4. scrollHeight() is javascript property which returns the entire height of element including padding.

Refer Below Links for some more details of Pagination.

Hope you find this helpful, in case of any queries/concerns, please post a reply or drop an email to me at .