Let’s look at an example with multiple ui:button components. Each button has a unique local ID, set by an aura:id attribute.
<!--c:buttonPressed--> <aura:component> <aura:attribute name="whichButton" type="String" /> <p>You clicked: {!v.whichButton}</p> <ui:button aura:id="button1" label="Click me" press="{!c.nameThatButton}"/> <ui:button aura:id="button2" label="Click me too" press="{!c.nameThatButton}"/> </aura:component>
Use event.getSource() in the client-side controller to get the button component that was clicked. Call getLocalId() to get the aura:id of the clicked button.
/* buttonPressedController.js */ ({ nameThatButton : function(cmp, event, helper) { var whichOne = event.getSource().getLocalId(); console.log(whichOne); cmp.set("v.whichButton", whichOne); } })
If you’re using lightning:button, use the onclick event handler instead of the press event handler.
<aura:component> <aura:attribute name="whichButton" type="String" /> <p>You clicked: {!v.whichButton}</p> <lightning:button aura:id="button1" name="buttonname1" label="Click me" onclick="{!c.nameThatButton}"/> <lightning:button aura:id="button2" name="buttonname2" label="Click me" onclick="{!c.nameThatButton}"/> </aura:component>