+ Start a Discussion
bluecapbluecap 

How do I pass the object record or record id into the Controller from a list of records?

Hi all,

I have a lightning component that displays a list of records. On each of the records I have a button group and each button needs to perform an action on that particular record. So my question is, how do I pass (or go get) the object record or the record ID to the JS controller?

Heres is my component.cmp...
<aura:iteration items="{!v.timeline.entries}" var="entry">
	<li class="slds-timeline__item" id="alertItem"><!-- {!'alertItem_' + entry.feedItemId}-->
		
		<div class="slds-media slds-media--reverse">
			<div class="slds-media__figure">
				<div class="slds-timeline__actions">
					 <!--button group - start-->
					
					<div class="slds-button-group" role="group">
					  <button class="slds-button slds-button--icon-border" onclick="{!c.showModal}">
						<c:BBsvg class="{!'slds-button__icon'}" xlinkHref="{!'/resource/BB_SLDS091/assets/icons/utility-sprite/svg/symbols.svg#edit'}" />
						<span class="slds-assistive-text">Edit</span>
					  </button>
					  <button class="slds-button slds-button--icon-border" onclick="{!c.dismissAlert}">
						<c:BBsvg class="{!'slds-button__icon'}" xlinkHref="{!'/resource/BB_SLDS091/assets/icons/utility-sprite/svg/symbols.svg#clear'}" />
						<span class="slds-assistive-text">Dismiss</span>
					  </button>
					  <button class="slds-button slds-button--icon-more" onclick="{!c.showModal}">
						<c:BBsvg class="{!'slds-button__icon'}" xlinkHref="{!'/resource/BB_SLDS091/assets/icons/utility-sprite/svg/symbols.svg#clock'}" />
						<span class="slds-assistive-text">Snooze</span>
					  </button>
					</div>
					
					<!--button group - end-->
					
				</div>
			</div>
			<!-- more about the record resides here -->
		</div>
	</li>
</aura:iteration>
Here is my controller.js...
({

    showModal : function(component, event, helper) {
    	document.getElementById("backGroundSectionId").style.display = "block";
    	document.getElementById("snoozeSectionId").style.display = "block";
    },
    dismissAlert : function(component, event, helper) {
		//update record as dismissed - how do I pull in the specific record id from the list in the UI?
    	document.getElementById("alertItem").style.display = "none";
    },
    saveRecord : function(component, event, helper) {
    	//save changes to the record
    }
})

All suggestions are appreciated. Thanks!
 
Best Answer chosen by bluecap
Krishna SambarajuKrishna Sambaraju
You can add a data attribute on the button set the id to the data attribute and get the value using event.currentTarget in the controller.js.
<!-- Add the Data attribute as follows in your buttons-->
<button class="slds-button slds-button--icon-border" data-id="{!entry.Id}" onclick="{!c.showModal}"/>

//Add the following lines in your controller method

showModal : function (component, event, helper)
{
    var entryId = event.currentTarget.dataset.id;
}
Hope this helps.

Regards,
Krishna.
 

All Answers

Ishwar ShindeIshwar Shinde
Hi,

Check if this can help - 
https://developer.salesforce.com/docs/atlas.en-us.lightning.meta/lightning/controllers_server_actions_call.htm
 
Krishna SambarajuKrishna Sambaraju
You can add a data attribute on the button set the id to the data attribute and get the value using event.currentTarget in the controller.js.
<!-- Add the Data attribute as follows in your buttons-->
<button class="slds-button slds-button--icon-border" data-id="{!entry.Id}" onclick="{!c.showModal}"/>

//Add the following lines in your controller method

showModal : function (component, event, helper)
{
    var entryId = event.currentTarget.dataset.id;
}
Hope this helps.

Regards,
Krishna.
 
This was selected as the best answer
bluecapbluecap
Thank you both for your responses. @krishna sambaraju - That works, thank you! I have a question for you though, where did you find reference to the "event.currentTarget.dataset.id"? Looking through the Aura reference guide (see below), Im not seeing currentTarget, nor dataset and how it is related to the data-id attribute of the button tag. Do you mind sharing where you found this information?

User-added image

 
Krishna SambarajuKrishna Sambaraju
This is pure javascript, so you won't find the documentation in aura docs.
bluecapbluecap
Ok, thanks Krishna!