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
SabrentSabrent 

Passing Selected Picklist Value to Apex Controller in lightning

In visualforce page I could do this <apex:actionSupport event="onchange" action="{!pickvalOnChange}" />

I have built a picklist of users . how  can i pass the selected picklist value to apex controller in lightning. ? 
  
<aura:component 
                controller="BuildPicklistOfUsers" 
                implements="flexipage:availableForRecordHome,force:hasRecordId" access="global" >
    
   	<aura:handler name="init" value="{!this}" action="{!c.doInit}"></aura:handler>
    <aura:attribute name="users" type="user[]"></aura:attribute>
    
    <lightning:select label="Choose User" name="uzr" aura:id="uzr"> 
        <aura:iteration items="{!v.users}" var="user">
			<option value="{!user.Id}">{!user.Name}</option>
        </aura:iteration>
	</lightning:select>
	
</aura:component>

// client side controller

({
     doInit: function(component, event, helper) {
    
    var action = component.get("c.getUserList");
    console.log("@@@action",action);
    action.setCallback(this, function(result){
    var users = result.getReturnValue();
    console.log("@@@@users",users);
    component.set("v.users", users);
    window.setTimeout(
    $A.getCallback( function() {
    component.find("uzr").set("v.value", users[4].Id);
    }));
    });
    $A.enqueueAction(action);
    }
})

// Server side controller
global class BuildPicklistOfUsers {
    @AuraEnabled global static User[] getUserList() {
    	return [SELECT id, Name FROM User];
    }
}

 
Best Answer chosen by Sabrent
Raj VakatiRaj Vakati
Try this code
  
global class BuildPicklistOfUsers {
    @AuraEnabled 
    global static User[] getUserList() {
        return [SELECT id, Name FROM User];
    }
    
    
    @AuraEnabled 
    global static User getSelectedUser(String sname) {
        return [SELECT id, Name FROM User where Id=:sname];
    } 
    
}
  
<aura:component 
                controller="BuildPicklistOfUsers" 
                implements="flexipage:availableForRecordHome,force:hasRecordId" access="global" >
    
    <aura:handler name="init" value="{!this}" action="{!c.doInit}"></aura:handler>
    <aura:attribute name="users" type="user[]"></aura:attribute>
    
    <aura:attribute name="uSelected" type="user"></aura:attribute>
    
    
    <lightning:select label="Choose User" name="uzr" aura:id="uzr" onchange="{!c.onChangeVal}"> 
        <aura:iteration items="{!v.users}" var="user">
            <option value="{!user.Id}">{!user.Name}</option>
        </aura:iteration>
    </lightning:select>
    
    
    Selected Val : {!v.uSelected.Name}
    
</aura:component>
  
({
    doInit: function(component, event, helper) {
        
        var action = component.get("c.getUserList");
        action.setCallback(this, function(result){
            var users = result.getReturnValue();
            component.set("v.users", users);
        });
        $A.enqueueAction(action);
    } ,
    onChangeVal:function (component, event, helper) {
        var val = event.getSource().get("v.value");
        console.log('val'+val);
        var action = component.get("c.getSelectedUser");
        action.setParams({"sname":val});
        action.setCallback(this, function(result){
            var users = result.getReturnValue();
            component.set("v.uSelected", users);
        });
        $A.enqueueAction(action);
    },
})
  
<aura:application extends="force:slds" >
    <c:PicklistValueChange/>
</aura:application>

 

All Answers

NagendraNagendra (Salesforce Developers) 
Hi,

To get the values from a normal select list, you can do something like this: 
var selected = 
Array.prototype.filter.call( 
component.find("selectList").getElement().options, 
function(option)
 { return option.selected; } 
)
.map( 
function(option) { 
return option.value;
 }
 );
Where "selectList" is the select list: 
<select aura:id="selectList"> <aura:iteration items="{!v.options}" var="option"> <option value="{!option.value}">{!option.label}</option> </aura:iteration> </select>
Hope this helps.

Kindly mark this as solved if the reply was helpful so that it gets removed from the unanswered queue which results in helping others who are facing a similar issue.

Thanks,
Nagendra
 
Raj VakatiRaj Vakati
Try this code
  
global class BuildPicklistOfUsers {
    @AuraEnabled 
    global static User[] getUserList() {
        return [SELECT id, Name FROM User];
    }
    
    
    @AuraEnabled 
    global static User getSelectedUser(String sname) {
        return [SELECT id, Name FROM User where Id=:sname];
    } 
    
}
  
<aura:component 
                controller="BuildPicklistOfUsers" 
                implements="flexipage:availableForRecordHome,force:hasRecordId" access="global" >
    
    <aura:handler name="init" value="{!this}" action="{!c.doInit}"></aura:handler>
    <aura:attribute name="users" type="user[]"></aura:attribute>
    
    <aura:attribute name="uSelected" type="user"></aura:attribute>
    
    
    <lightning:select label="Choose User" name="uzr" aura:id="uzr" onchange="{!c.onChangeVal}"> 
        <aura:iteration items="{!v.users}" var="user">
            <option value="{!user.Id}">{!user.Name}</option>
        </aura:iteration>
    </lightning:select>
    
    
    Selected Val : {!v.uSelected.Name}
    
</aura:component>
  
({
    doInit: function(component, event, helper) {
        
        var action = component.get("c.getUserList");
        action.setCallback(this, function(result){
            var users = result.getReturnValue();
            component.set("v.users", users);
        });
        $A.enqueueAction(action);
    } ,
    onChangeVal:function (component, event, helper) {
        var val = event.getSource().get("v.value");
        console.log('val'+val);
        var action = component.get("c.getSelectedUser");
        action.setParams({"sname":val});
        action.setCallback(this, function(result){
            var users = result.getReturnValue();
            component.set("v.uSelected", users);
        });
        $A.enqueueAction(action);
    },
})
  
<aura:application extends="force:slds" >
    <c:PicklistValueChange/>
</aura:application>

 
This was selected as the best answer
SabrentSabrent
Thanks Taj and Rajendra. 

Truly appreciate your help.