0

I am using an and inside that I have one condition where I am rendering either or based on some condition

<aura:iteration items="{!dr.DataRowList}" var="drl">
<aura:if isTrue="{!drl.FieldValue}">

   <div value="{!v.selectedUsers}" >
      <p id="{!'input-'+index}" data-refid="recordId" data-id="{!dr.DataRowList[0].FieldValue}" data-index="{!index}" href="javascript:void(0);">                                                                                                                  
          <ui:inputCheckbox value="true" click="{!c.onclick}" />                                                                                                                
      </p>                                                                                                                
   <aura:set attribute="else">                                                                                                               
      <p id="{!'output-'+index}" data-refid="recordId" data-id="{!dr.DataRowList[0].FieldValue}" data-index="{!index}">                                                                                                                        
          <ui:outputCheckbox value="true"/>                                                                                                                    
      </p>                                                                                                                
   </aura:set>                                                                                                               
   </div>                                                                                                        
</aura:if>

I m trying to access the component by var result = event.currentTarget.getAttribute('data-id') but it throws error that

getAttribute is not a function.

Whereas same thing I am using at different place in component it is working fine but there is no I read about lockerservices that blocks the event.target and event.currentTarget to access it.

Is there any other way to get the "id" of <p> element.

1
  • 2
    The ideal way to do it is to create a component for the elements inside the aura iteration and create an index attribute in that component. This will help you easily get attributes belonging to that instance of iteration.
    – RedDevil
    Dec 26, 2017 at 5:30

3 Answers 3

3

You should change your onclick function from the ui-input checkBox to the paragraph node itself to get the data-id value, Like this:

Component:

<p id="para Id" data-refid="recordId" data-id="data-id value" data-index="data-index value" href="javascript:void(0);" onclick="{!c.onclick}">                                                                                                                  
    <ui:inputCheckbox value="true"/>                                                                                                                
</p>

Controller:

onclick: function(component,event,helper){
    console.log(event.currentTarget.getAttribute('data-id'));
}
1

Try using event.getSource()

I think if you log

console.log(event.getSource().elements[0].data.id);

it should give you what you are looking for.

1

Can you try this one:

event.getSource().get("v.data-id")

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.