---
title: "Define action buttons for CDT"
slug: "define-action-buttons-for-cdt"
description: "Follow these steps to define action buttons that you want to appear in the Configurable Data Table (CDT) Lightning component."
updated: 2024-03-21T16:46:49Z
published: 2024-03-21T16:46:49Z
canonical: "docs.zilliant.com/define-action-buttons-for-cdt"
---
> ## Documentation Index
> Fetch the complete documentation index at: https://docs.zilliant.com/llms.txt
> Use this file to discover all available pages before exploring further.
# Define action buttons for CDT
Define action buttons that you want to appear in the **Configurable Data Table** (CDT) Lightning component.
## To define header-level action buttons
1. From the App Launcher, select **Data Table Configurations**, then select the configuration you defined.
2. Go to the **Related** tab. In the **Header Buttons Configuration** section, select **New**.
3. In the **New Data Table Header Button Configuration** dialog, enter information or make selections:
- **Header Buttons Configuration Name**—Enter a descriptive name for the configuration.
- **Data Table Configuration**—Enter the **Data Table Configuration Name** of this configuration.
- **Header Button Label**—Enter a user-meaningful label for the action button.
- **Header Button Label Override**—Enter a string value that overrides any existing button label translation
- **Event Payload**—Enter the value in JSON format that will be attached to the event. For example, it can be an action name that you want to point this custom event to: `{"HeaderPayloadField":"HeaderPayloadValue"}`
- **Header Button Order**—Enter the display order of the action button in the header picklist.
- **Button Event Handler**—Either search for the name of an [already-configured button event handler](/v1/docs/define-action-buttons-for-cdt#predefined-button-handlers), or [define a new custom event handler](/v1/docs/define-action-buttons-for-cdt#to-define-a-custom-button-handler) by selecting the option **+New Data Table Button Event Handler** (it appears when you click into the field).
4. Select **Save**.
## To define row-level action buttons
1. From the Lightning **App Launcher**, select **Data Table Configurations**, then select the configuration you defined.
2. In the **Related** tab, in the **Row Buttons Configuration** section, select **New**.
3. In the **New Data Table Row Button Configuration** dialog, enter information or make selections:
- **Row Button Configuration Name**—Enter a descriptive name for the configuration.
- **Data Table Configuration**—Enter the **Data Table Configuration Name** of this configuration.
- **Row Button Label**—Enter a user-meaningful label for the action button.
- **Row Button Label Override**—Enter a string value that overrides any existing button label translation.
- **Event Payload**—Enter the value in JSON format that will be attached to the event. For example, it can be an action name that you want to point this custom event to: `{"rowPayloadField","rowPayloadValue"}`.
- **Row Button Order**—Enter the display order of the action button in the row actions picklist.
- **Button Event Handler**—Either search for the name of an [pre-defined button event handler](/v1/docs/define-action-buttons-for-cdt#predefined-button-handlers), or [define a new custom event handler](/v1/docs/define-action-buttons-for-cdt#to-define-a-custom-button-handler) by selecting the option **+New Data Table Button Event Handler** (it appears when you click into the field).
4. Select **Save**.
## Event handlers
All pre-defined button handlers, and any new custom handlers that you define, are stored in the **zpf__DataTableButtonEventHandler__c.** object.
### Pre-defined button handlers
These handler configurations exist by default. You need only search for the following configuration names in the **Button Event Handler** field.
- PursuePGAButtonHandler
- DismissPGAButtonHandler
- WonPGAButtonHandler
- LostPGAButtonHandler
- SnoozePGAButtonHandler
- AcceptPGAButtonHandler
- RejectPGAButtonHandler
### To define a custom button handler
1. In the **New Data Table Button Event Handler** dialog, enter information or make selections:
- **Button Handler Name**—Enter a descriptive name for the handler configuration.
- **Button Handler Component Name**—Enter the API name of a Lightning component that will handle the event on the action button.
2. Create a Lightning component that will provide the handler code for the action button.
#### Details of the component
The new Lightning component must implement the **zpf:ConfigurableDataTableActionEventHandler** interface:
```
```
The new component must have a controller function named **handleEvent**. The **handleEvent** function will have access to the selected records (multiple record Ids).
Example of the **CustomActionEventHandler** component:
```
```
**CustomActionEventHandler** controller:
```
({
handleEvent: function (component, event) {
const params = event.getParam('arguments');
if(!params) return;
component.set("v.selectedIds", params.records);
component.set("v.parentId", params.parentId);
component.set("v.payload", params.payload);
}
});
```
 App Launcher