function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
Jordan VasquezJordan Vasquez 

How to grab label/innerText from Lightning:select picklist?

Hey everyone,

I want to grab the value of my label for a dynamic picklist but I am not sure how it is to be done and I have scoured the Internet and have not found anything that works for myself. Right now I am using the value field to grab the ID of an Account from the picklist but I also need to grab the name. I figured I would be able to grab it from the selected option's label but I haven't been able to do it.

Here is the lightning:select in my new lightning component: 
<lightning:select aura:id="accountSelect"
    name="account"
    label="Select Account"
    required="true"
     value="{!v.acctId}"
    onchange="{!c.changeAccount}">
        <aura:iteration items="{!v.lstAccount}" var="acct" >
            <option value="{!acct.Id}" >{!acct.Name}</option>
        </aura:iteration>
</lightning:select>

And here is my controller: 
changeAccount: function(component,event,helper){
		console.log('Account changed.'); 
        var label = component.find("accountSelect").get("v.label");
        
        console.log('log that it changed, new account name: ' + label);
}

Thanks for any help!
Best Answer chosen by Jordan Vasquez
Ashif KhanAshif Khan
Hi Jordan,

You need to do a workaround to get Value and label both of a picklist
  
<lightning:select aura:id="accountSelect"
    name="account"
    label="Select Account"
   value="{!v.acctId}"
    onchange="{!c.changeAccount}">
    <aura:iteration items="{!v.lstAccount}" var="acct" indexVar="index">
     <option value="{!index}" >{!acct.Name}</option>
    </aura:iteration>
    </lightning:select>
  
changeAccount: function (component , event, helper) {
     var acc= component.get("v.lstAccount")[component.get("v.acctId")];
      console.log('log that it changed, new account name: ' + acc.Name);
       console.log('log that it changed, new account name: ' + acc.Id);

    },

I hope this will help you

Regards
Ashif

All Answers

Raj VakatiRaj Vakati
component.find("accountSelect").get("v.value");

 
Ashif KhanAshif Khan
Hi Jordan,

You need to do a workaround to get Value and label both of a picklist
  
<lightning:select aura:id="accountSelect"
    name="account"
    label="Select Account"
   value="{!v.acctId}"
    onchange="{!c.changeAccount}">
    <aura:iteration items="{!v.lstAccount}" var="acct" indexVar="index">
     <option value="{!index}" >{!acct.Name}</option>
    </aura:iteration>
    </lightning:select>
  
changeAccount: function (component , event, helper) {
     var acc= component.get("v.lstAccount")[component.get("v.acctId")];
      console.log('log that it changed, new account name: ' + acc.Name);
       console.log('log that it changed, new account name: ' + acc.Id);

    },

I hope this will help you

Regards
Ashif
This was selected as the best answer
Jordan VasquezJordan Vasquez
Thanks Ashif, worked perfectly!
Mothi MullackalMothi Mullackal
HI
   <ui:inputSelect value="{!v.selectedAccounts}" aura:id="levels" label="Activity" change="{!c.changeActivity}">
           <ui:inputSelectOption text="None" label="None"/>
              <aura:iteration items="{!v.acts}" var="level">
                  <ui:inputSelectOption text="{!level.FullInfo__c}" label="{!level.Name}"/>
             </aura:iteration>
 
        </ui:inputSelect>
I am trying to get the text value of the selected option, i am not able to get it. Can you please help on this?
I tried below, it gives me the value not the text
 console.log(component.find("levels").get("v.value"));//for drop downlist Value

Am i missing something. Please help.. Thanks
Jordan VasquezJordan Vasquez
Hi Mothi,

Try this:  
COMPONENT:
<ui:inputSelect value="{!v.selectedAccounts}" aura:id="levels" label="Activity" change="{!c.changeActivity}">
    <ui:inputSelectOption text="None" label="None"/>
    <aura:iteration items="{!v.acts}" var="level" indexVar="index">
        <ui:inputSelectOption text="{!index}" label="{!level.Name}"/>
    </aura:iteration> 
</ui:inputSelect>

CONTROLLER:
changeActivity: function(component){
    var value = component.find("levels").get("v.selectedAccounts");
    if(value === "None"){
        var outputName = value;
    }
    else{
        var outputName = component.get("v.acts")[value].Name;
    }
    console.log(outputName);
},

 
System Admin19System Admin19
Thank you very much this support