I'm iterating over a list using aura:iteration. Each iteration I have a radio button where I have an attribute named data-index="{!index}". In the controller, when I try to print which radio button index was selected it keeps printing only the index of the first one.

Component :

<aura:iteration items="{!v.allBadges}" var="badge" indexVar="index"> 
  <div class="slds-size_3-of-4 slds-border_bottom slds-p-bottom_small">
                <div class="slds-media">
                    <input type="radio" id="radio-selector" data-index="{!index}" checked="{!badge.checked}" onchange="{!c.handleChange}" class="slds-m-around_large"/>

Controller :

handleChange : function(component,event,helper) {
    console.log('inside handleChange');
    var selected = document.getElementById('radio-selector');        
    console.log('selected = '+selected.dataset.index);

Keeps printing the index value 0 for each radio button. My understanding is that each radio button during the iteration has a unique index value

Your Answer

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

Browse other questions tagged or ask your own question.