Add Pagination to Data Repeaters and Data Tables

Events let you add interactive and animated effects to the pages and page elements of your website. When using data repeaters and data tables, you can add pagination events so users can easily page through the displayed data. Pagination events are particularly useful when working with large amounts of data.

Required Editions

Available in: Salesforce Classic

Available for purchase in: Enterprise, Performance, and Unlimited Editions

Available (with limitations) in: Developer Edition

User Permissions Needed
To build, edit, and manage Site.com sites:

Site.com Publisher User field enabled on the user detail page

AND

Site administrator or designer role assigned at the site level

For example, if you've added a data repeater that displays all the users in an organization, you can add pagination to help users navigate through the data. You can add three pagination events:

  • Previous Page
  • Next Page
  • Go To Page

Create Previous and Next Pagination:

You can create previous and next buttons so users can move through the data one page at a time. The process for creating both buttons is the same.

  1. Create your data repeater or data table.
  2. In the data repeater or data table, be sure to specify how many records to display per page in the Limits section.
  3. Drag a button to the page.
  4. In the Properties pane, change the Button Name to Previous Page or Next Page as appropriate.
  5. In the Events pane, select the click event.
  6. When the Actions box appears, click Add and select the Previous Page or Next Page action.
  7. In the Target Element, select the data repeater or data table.
  8. Click Save.

Create GoTo Pagination:

Creating GoTo navigation is similar to creating the previous and next buttons, but you must add an input field so users can specify what page they what to go to.

  1. Create your data repeater or data table.
  2. In the data repeater or data table, be sure to specify how many records to display per page in the Limits section.
  3. Drag a Number field onto the page.
  4. In the Properties pane, change the field's Label Name to something that makes sense. For example, Enter Page Number.
  5. Drag a Button onto the page.
  6. In the Properties pane, change the Button Name to GoTo Page.
  7. In the Events pane, select the click event.
  8. When the Actions box appears, click Add and select the Go To Page action.
  9. In the Target Element, select the data repeater or data table.
  10. For Input Field ID, select the field you created in step 3.
  11. Click Save.