1

I'm experiencing a weird issue when trying cmp.find('id') with elements inside and outside <aura:if>. Here is the code:

<aura:attribute name="editMode" type="boolean" default="false"/>
<div class="slds">
    <ui:inputText aura:id="text1" class="slds-input" value="11223" disabled="true"/>

    <div class="slds-modal__content">      
        <ui:inputText aura:id="text2" class="slds-input" value="11223" disabled="true"/>

    <aura:if isTrue="{!v.editMode}">
        <ui:inputText aura:id="text1" class="slds-input" value="11223" disabled="true"/>
    </aura:if>

JS Controller:

console.log("text1: "+cmp.find("text1"));
console.log("text2: "+cmp.find("text2"));
console.log("text3: "+cmp.find("text3"));

Console:

text1: markup://ui:inputText {8:557;a} {text1}
text2: markup://ui:inputText {8:557;a} {text2}
text1: undefined

Note:

  • The first time it runs, none of them is undefined.
  • The second time, last one (inside aura:if) is undefined.
  • editMode is set to true in helper's init so assume it's always true.
  • If I use <aura:if isTrue="true"> or editMode attribute's default is true, it always runs fine and all values are "defined"

Help is appreciated.

1

You provide same id for two input text. Change the Id of the last one input text and try it again may be it work properly.

Thanks.

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.