+ Start a Discussion
Javier CastroJavier Castro 

Unable to set default value in a dynamic select field

Hi everyone, I am working on a Lightning Component which has a lightning select with its values fetched dynamically from a picklist field.
 
<lightning:select aura:id="select" label="Estado de la cita" name="source" onchange="{!c.handleSelect}" class="slds-m-bottom_medium">
     <option value="" disabled="true" text="-- Selecciona Estado --"/>
     <option value="Todos" text="Todos"/>
     <aura:iteration var="stat" items="{!v.statusList}">
          <option value="{!stat}" text="{!stat}"/>
     </aura:iteration>
 </lightning:select>

I found on the Internet this solution but it's not working for me
doInit: function(cmp){
        
        var action = cmp.get("c.getStatus");
        
        action.setCallback(this, function(response) {
            var state = response.getState();
            var statusList = response.getReturnValue();
            if(state == "SUCCESS"){
                cmp.set("v.statusList",statusList);
                window.setTimeout(
                $A.getCallback( function() {
                    cmp.find("select").set("v.statusList", statusList[1]);
                }));
            }
        });
        
        $A.enqueueAction(action);
    },
The cmp.find recover the value I want but then that value it's not setted as default.

Someone can help me?

Regards and thanks in advance
 
Best Answer chosen by Javier Castro
Adilson Arcoverde JrAdilson Arcoverde Jr
Hi  Javier,

What you have to do is fix your code like this sample:
<option value="{!stat} selected="{!stat==<your object attribute>" text="{!stat}"/>

Full code here:
<aura:if isTrue="{!v.vidaWrapper.exibir}">
	    	<div class="slds-grid slds-gutters slds-wrap" style="margin: 10px" >
		        <div class="slds-col slds-size_2-of-2">
		            <lightning:input value="{!v.vidaWrapper.nomeCompleto}" label="Nome:" required="true"/>
		        </div>
		        <div class="slds-col slds-size_2-of-2">
		            <lightning:input value="{!v.vidaWrapper.titular.Nome_da_Mae__c}" label="Nome da Mãe:" required="true"/>
		        </div>
		        <div class="slds-col slds-size_2-of-2">
		            <lightning:input value="{!v.vidaWrapper.titular.CPF__c}" label="CPF:" required="true"/>
		        </div>
		        <div class="slds-col slds-size_2-of-2">
		            <lightning:input type="date" value="{!v.vidaWrapper.dataNascimento}" label="Data de Nascimento" required="false"/>
		        </div>
		        <div class="slds-col slds-size_2-of-2">
		            <lightning:select name="{!index}" aura:id="produto" label="Produto:" required="true" onchange="{!c.changeProduto}">
		                <option value="">Selecione um produto</option>
		                <aura:iteration items="{!v.produtos}" var="produto">
		                    <option value="{!produto.value}" selected="{!v.vidaWrapper.vida.Produto__c == produto.value}">{!produto.label}</option>
		                </aura:iteration>
		            </lightning:select>                                
		        </div>
		        <div class="slds-col slds-size_2-of-2" style="margin-top: 5px; text-align: center">
					<lightning:button iconName="utility:check" value="{!indexDependente}" variant="brand" label="Salvar" onclick="{!c.doSaveTitular}"/>
				</div>
	    	</div>
	    </aura:if>

Where {!v.vidaWrapper} is an attribute. Then I compare the value stored on field Produto__c with the resulting var of iteration. 
<option value="{!produto.value}" selected="{!v.vidaWrapper.vida.Produto__c == produto.value}">{!produto.label}</option>

Make sense to you?

Let me know if I can help you.

Regards.

All Answers

Adilson Arcoverde JrAdilson Arcoverde Jr
Hi  Javier,

What you have to do is fix your code like this sample:
<option value="{!stat} selected="{!stat==<your object attribute>" text="{!stat}"/>

Full code here:
<aura:if isTrue="{!v.vidaWrapper.exibir}">
	    	<div class="slds-grid slds-gutters slds-wrap" style="margin: 10px" >
		        <div class="slds-col slds-size_2-of-2">
		            <lightning:input value="{!v.vidaWrapper.nomeCompleto}" label="Nome:" required="true"/>
		        </div>
		        <div class="slds-col slds-size_2-of-2">
		            <lightning:input value="{!v.vidaWrapper.titular.Nome_da_Mae__c}" label="Nome da Mãe:" required="true"/>
		        </div>
		        <div class="slds-col slds-size_2-of-2">
		            <lightning:input value="{!v.vidaWrapper.titular.CPF__c}" label="CPF:" required="true"/>
		        </div>
		        <div class="slds-col slds-size_2-of-2">
		            <lightning:input type="date" value="{!v.vidaWrapper.dataNascimento}" label="Data de Nascimento" required="false"/>
		        </div>
		        <div class="slds-col slds-size_2-of-2">
		            <lightning:select name="{!index}" aura:id="produto" label="Produto:" required="true" onchange="{!c.changeProduto}">
		                <option value="">Selecione um produto</option>
		                <aura:iteration items="{!v.produtos}" var="produto">
		                    <option value="{!produto.value}" selected="{!v.vidaWrapper.vida.Produto__c == produto.value}">{!produto.label}</option>
		                </aura:iteration>
		            </lightning:select>                                
		        </div>
		        <div class="slds-col slds-size_2-of-2" style="margin-top: 5px; text-align: center">
					<lightning:button iconName="utility:check" value="{!indexDependente}" variant="brand" label="Salvar" onclick="{!c.doSaveTitular}"/>
				</div>
	    	</div>
	    </aura:if>

Where {!v.vidaWrapper} is an attribute. Then I compare the value stored on field Produto__c with the resulting var of iteration. 
<option value="{!produto.value}" selected="{!v.vidaWrapper.vida.Produto__c == produto.value}">{!produto.label}</option>

Make sense to you?

Let me know if I can help you.

Regards.
This was selected as the best answer
Javier CastroJavier Castro
Thank you so much! @AdilsonArcoverdeJr

This solved my problem
<option value="{!stat} selected="{!stat==<your object attribute>" text="{!stat}"/>