Scroll to top

How To Implement Pagination In VBCS


Roshan - July 22, 2022 - 0 comments - 374 Views

Reading Time: 3 minutes

In this blog, we will discuss why pagination is essential and how you can successfully implement it in the Visual Builder Studio. Let’s start with the problem.

The Problem

How to implement Pagination in VBCS?

how to implement pagination in vbcs

The Solution

First drag & drop table components in the required page, after dropping the table, insert required data into the table using SDP(ServiceDataProvider). SDP(ServiceDataProvider) is a variable created using the required endpoint.

There is one Property available in the table component, to achieve this requirement, scroll-policy=”loadMoreOnScroll” is used.  Here in this tutorial we will explain to you how to achieve this requirement.

This together with a ServiceDataProvider that is based on a REST service correctly pass the limit and offset parameters to the REST service your table is based on.

Step 1: Create a variable type from the required End point and give the variable type required name.

pagination in vbcs

Step 2: Create a variable and select type as SERVICE DATA PROVIDER (SDP).

pagination in vbcs

For the Current SDP, in the property section click on Select the endpoint and choose the variable type created in step 1.

select the endpoint

Step 3:  On the required table, set your SDP variable in the Data section as hlighted below.

Choose the required column like Job Title, Company and Status.

set your sdp variable

Step 4: Under the All property section, set Scroll Policy as loadMoreOnScroll

load more on scroll

Step 5: To choose a different .js file, click the Source dropdown and select the file or select Create to create a new .js file, choosing the functions you want to override. The Create Transforms dialog displays.

how to implement pagination in vbcs

Step 6: Click File name and enter a new .js file name.

The Base transform dropdown shows the file that supplies the base code for all of your transform functions.

In Override functions, select the function(s) you want to add to the newly created transforms file. Functions that you don’t select won’t be added to the transforms file.

pagination in vbcs

The Result

Count: Total Number of items(rows) returned.

hasMore: hasMore = true when more data(rows) is to be returned and hasMore = false When all the data(rows) is returned.
Limit: determines end point.

Offset: determines starting point.

pagination implemented in vbcs

 

We hope you liked the blog on pagination in VBCS. If you have any queries or concern, please write to us at [email protected].

You might also like: How to Implement Version Control Using Visual Builder Studio

Roshan

Roshan comes with an extensive experience in the Oracle Implementation domain after completing his Electronics and Communication Engineering from Bengaluru. He holds a plethora of professional certifications from Oracle after starting as an Associate Developer role and quickly made his way to a Senior Manager. He has worked with clients across the globe in ANZ, EMEA, APAC and Europe. At Conneqtion Group, Roshan has been a key part of managing the organization’s largest risk teams apart from sharing his experience and skills to develop and nurture young talent with his dynamic vision.  

 

Author avatar

Roshan

Roshan comes with an extensive experience in the Oracle Implementation domain after completing his Electronics and Communication Engineering from Bengaluru. He holds a plethora of professional certifications from Oracle after starting as an Associate Developer role and quickly made his way to a Senior Manager. He has worked with clients across the globe in ANZ, EMEA, APAC and Europe. At Conneqtion Group, Roshan has been a key part of managing the organization’s largest risk teams apart from sharing his experience and skills to develop and nurture young talent with his dynamic vision.    

Related posts

Post a Comment

Your email address will not be published. Required fields are marked *