0

i am new to lightning and i need to add a aura:if condition to one of lightning select option. My lightning select option contains a none value along with other options that render data in a datatable from a brand_car__c object. the first value is "none" and other values contains data.

ex: if i select value as "Suzuki" then it will render the data in a datatable of type brand suzuki.

i need to add a condition where if brand=="none" then it should show no records available. how should i add it in the code??

<div class="slds-box slds-theme_default">  
    <lightning:layout multipleRows="true">
        <lightning:layoutItem padding="around-small" size="4">
            <lightning:select name="brandName" label="Select a brand" aura:id="brandName" value="{!v.selectedBrandName}" onchange="{!c.onChange}">

                <aura:iteration items="{!v.BrandOptions}" var="option" indexVar="key">
                    <option text="{!option.value}" value="{!option.key}"/>
                </aura:iteration>
            </lightning:select>
        </lightning:layoutItem>
    </lightning:layout>
  • how/where render function works? is it from lightning:select onchange event? if yes you can add default value when selected value is none, plz update your question with onchange event function. – sdandamud1 May 20 '19 at 10:32
0

Lightning Component:

  <aura:attribute name="lstRecords" type="List"/>
    <lightning:select name="brandName" label="Select a brand" aura:id="brandName" value="{!v.selectedBrandName}" onchange="{!c.onChange}">
                 <aura:iteration items="{!v.BrandOptions}" var="option" indexVar="key">
                           <option text="{!option.value}" value="{!option.key}"/>
                 </aura:iteration>
    </lightning:select>

    <aura:if isTrue="{!v.lstRecords.length > 0}">
         <!-- Display list of records -->
          <aura:set attribute="else">
               No result found
          </aura:set>
    </aura:if>

component Controller:

onChange: function (cmp, evt, helper) {
           var selectedBrand = cmp.find('brandName').get('v.value');
            if(selectedBrand  == 'none'){
                alert('Please select the brand!'); 
                 //after alert, List should be set as blank component.set("v.lstRecords", []);
            }else{
                //server call to @aura method
                //get result and assign to lstRecords
                 component.set("v.lstRecords", result);
              }
       }
| improve this answer | |

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