Pagination using Component Events in Aura Component

Updated: Jan 17

Event-driven programming is used in many languages and frameworks, such as JavaScript and Java Swing. The idea is that you write handlers that respond to interface events as they occur.

Events are fired from JavaScript controller actions that are typically triggered by a user interacting with the user interface.

There are two types of events in the framework:

· Component events are handled by the component itself or a component that instantiates or contains the component.

· Application events are handled by all components that are listening to the event. These events are essentially a traditional publish-subscribe model.

In this article we will see how pagination is done with the help of component events. The idea is to use events is make the code re-usable. The below screenshot shows the data of an Account (SObject). The data table is loaded with the account detail basis on the filter Account Type.

Pagination using Component Event

These component have some extra functionalities like New, edit and delete record.

To achieve this we need to create two components : Parent Component and Child Component.

1. Component Event - First of all define a component Event.

2. Child Component :-

So, here we need to register an event so that we can fire it in this component. Now create an component and name it as PaginationEvent.

a. Component file-

b. Controller :-

3. Parent Component :-

Now in above section we have created an child component where are we are firing an event. Now we will write a handler to catch it. Create another component and name it as First Component.

a. Component file :-

b. Controller js :-

C. Helper Code:-

Get account types from Account Object.

4. Apex Code -

Now, the last step is to get values from an Account object using apex. For this we need to add an apex file into our component. To add an apex class, in developer console , go to file menu ->New-> Apex Class.

We have used an method getDescribe of Sobject class DescribeFieldResult which will return the field result of Account type. And then getting the picklist values by using getPicklistValues().

Other than that we are getting account detail and inserting and deleting account records.

©2019 by SFDC Blogs.