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.

Improve this question
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

Reset to default
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'));
}
Improve this answer
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.

Improve this answer
1

Can you try this one:

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

Improve this answer

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.