Handle the X close button event in Lightning quick action modal

In Salesforce Lightning, quick actions are a powerful way to improve the user experience by allowing users to perform common tasks from a single location. However, one issue that can arise when using quick actions is that it can be difficult to handle the event when the user closes the quick action.

Thankfully, the Lightning framework provides a solution for this problem. The aura:component tag includes a destroy event that can be used to handle the X close button event. In the example below, the handleDestroy function is used to handle this event.

<aura:component implements="force:hasRecordId,force:lightningQuickActionWithoutHeader" controller="SimpleServerSideController">
<aura:handler name="destroy" value="{!this}" action="{!c.handleDestroy}"/>
<p>This is a aura component</p>
view raw convertLead.cmp hosted with ❤ by GitHub

handleDestroy : function (component, event, helper) {
var val = event.getParam("value");
// Do something else here
var action = component.get("c.clearData");
recId : component.get("v.recordId")
// Create a callback that is executed after
// the server-side action returns
action.setCallback(this, function(response) {
var state = response.getState();
if (state === "SUCCESS") {
// Alert the user with the value returned
// from the server
console.log("From server: " + response.getReturnValue());
// You would typically fire a event here to trigger
// client-side notification that the server-side
// action is complete

In the example, the handleDestroy function is passed three parameters: the component, the event, and the helper. The event.getParam("value") method is used to get the value of the event. In this case, the value of the event is not important, so it is not used in the function.

Instead, the handleDestroy function is used to call an Apex controller method clearData to clear the data when the quick action is closed. The action.setParams method is used to set the parameters for the Apex controller method. In this case, the recId parameter is set to the recordId of the component.

The action.setCallback method is used to create a callback function that is executed after the server-side action returns. The callback function checks the state of the response and, if it is successful, it logs a message to the console.

In conclusion, handling the X close button event in a Lightning quick action is a simple process that can be accomplished using the aura:component tag’s destroy event and a callback function. This example demonstrates how to call an Apex controller method to clear data when the quick action is closed, but this event can be used for any action that needs to be performed when the quick action is closed.


About the blog

SFDCLessons is a blog where you can find various Salesforce tutorials and tips that we have written to help beginners and experienced developers alike. we also share my experience and knowledge on Salesforce best practices, troubleshooting, and optimization. Don’t forget to follow us on:


Subscribe to our email newsletter to be notified when a new post is published.


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s