Back to Top

Change the label of the clicked salesforce lightning button

Updated 3 January 2020

Lightning Button

lightning-button a component represents a button element that executes an action. Use lightning-button where users need to:

  • submit or reset a form
  • begin a new task
  • trigger a new UI element to appear on the page
  • specify a new or next step in a process

For More info, you can check salesforce official doc here

Change label of lightning button

Create a lightning aura component(eq: auraComponent) & write below script in .cmp(eq: auraComponent.cmp) file.

<aura:component>
    <lightning:button class="deselectAllitem"  onclick="{! c.docheckClick }" name="Test" label="Select All" title="Test" />
    <lightning:button class="deselectAllitem"  onclick="{! c.docheckClick }" name="Test2" label="Select All" title="Test2" />
</aura:component>

After adding the above script, create a js controller(auraComponentController.js) file & write the below script.

({
	docheckClick : function(component, event, helper) {
            var label = event.getSource().get("v.label");
            if(label == 'Select All') {
                event.getSource().set("v.label","Deselect All")
            } else {
                event.getSource().set("v.label","Select All")
            }
	}
})

Now create a lightning aura(auraComponentPreview) app to preview the functionality & include the above aura component in the lightning aura app(auraComponentPreview.app).

Searching for an experienced
Salesforce Company ?
Find out More
<aura:application>
    <c:auraComponent/>
</aura:application>

Now click the “preview” button to check component functionality.

. . .

Leave a Comment

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


2 comments

  • sunny
  • Zivoke
  • Back to Top

    Message Sent!

    If you have more details or questions, you can reply to the received confirmation email.

    Back to Home