+ Start a Discussion
Ananya DhimanAnanya Dhiman 

I have to show a picklist which contains 4 standard objects i.e. Account, Case , Contact and Opportunity, so that when I click on an object another multi select picklist should be displayed which will contain all fields of that object in lightning cmp.

Hi everyone, I'm new to lightning and trying to learn few things.
Problem is that I am able to display the picklist for objects as well as a multi select picklist. But when I click on an object I am getting the related fields in my console.log(resoponseValue) but not in the UI of my aura app when I run the code. Please help me acheiving this task. Here is my code for the same :

Apex Controller:
public class PickList {
    @AuraEnabled
    public static List <String> getPiklistValues(String objName) {
        System.debug('objName--'+objName);
        List<String>apiNames =  new list<String>();
        
        Map<String, Schema.SObjectType> schemaMap = Schema.getGlobalDescribe();
        Map<String, Schema.SObjectField> fieldMap=new  Map<String, Schema.SObjectField>();
        if(objName.contains('Account')){
            fieldMap= schemaMap.get('Account').getDescribe().fields.getMap();             
        }else if(objName.contains('Case')){
            fieldMap= schemaMap.get('Case').getDescribe().fields.getMap();   
        }else if(objName.contains('Contact')){
            fieldMap= schemaMap.get('Contact').getDescribe().fields.getMap();   
        }else if(objName.contains('Opportunity')){
            fieldMap= schemaMap.get('Opportunity').getDescribe().fields.getMap();   
        }
        
        for(String fieldName : fieldMap.keyset() )
        {
            system.debug('@@@@@@@'+fieldName); 
            apiNames.add(fieldName);
        }
        return apiNames;
    }
}

Cmp : 
<aura:component controller="PickList" implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes,force:lightningQuickAction,lightning:actionOverride" access="global" >
    <aura:attribute name="options" type="List" default="Select Object, Account, Case, Contact, Opportunity"/>
    <aura:attribute name="selectedValue" type="String" />
    <aura:attribute name="FieldsList" type="List" />
    <aura:attribute name="SelectedFieldsList" type="List" />
   <!-- <aura:handler name="init" action="{!c.doInit}" value="{!this}"/>-->

    <!--Code for displaying objects in picklist-->
    <select style="border: 1px solid #A9A29E;" class="slds-select"  id="objectName" onchange="{!c.myAction}">
        <aura:iteration items="{!v.options}" var="abc">
            <option value="{!abc}" text="{!abc}" />
        </aura:iteration>
    </select>
    <!--Code for displaying fields of object-->
    <div class="slds-m-around_xx-large">
        <lightning:dualListbox aura:id="selectFields"
                               name="Fields"
                               label="Select Fields"
                               sourceLabel="Available Fields"
                               selectedLabel="Selected Fields"
                               options="{!v.FieldsList }"
                               value="{!v.SelectedFieldsList}"
                               onchange="{!c.handleSubmitChange}"/>
        <lightning:button variant="brand" label="Submit" onclick="{!c.getSelectedFields}" />
    </div>
</aura:component/>

Controller JS :
({
 myAction : function(component, event, helper) {
        var action = component.get('c.getPiklistValues');
        var t=document.getElementById("objectName").value;
        alert('object--'+t);
        action.setParams({
            objName : t,
        });
        action.setCallback(this,function(response){
            var responseValue = response.getReturnValue();
                    console.log(responseValue);
            component.set("v.FieldsList",responseValue);
        });
        $A.enqueueAction(action);
    },
    handleSubmitChange: function (component, event, helper) {
        //alert('ok');
        var e = event.getParam("value");
        component.set("v.SelectedFieldsList", e);
    },
    getSelectedFields : function(component, event, helper){
        // alert('fine');
        var s = component.get("v.SelectedFieldsList");
        console.log('$$$$' , s);
    }
})

Thanks in advance.

Devi ChandrikaDevi Chandrika (Salesforce Developers) 
Hi Ananya,
For lightning:dualListbox component options attribute should be object list.Each option should have the  following attributes: label and value.But here your are just passing  only field names in list.That is why you are not getting field names in UI. Pass the fieldNames in Label ,value format.

Please refer below link which might help you in this
https://developer.salesforce.com/docs/component-library/bundle/lightning:dualListbox/example

I did few changes in your code.Try this code
apex class

public class PickList {
    @AuraEnabled
    public static String getPiklistValues(String objName) {
        System.debug('objName--'+objName);
        List<wrapper>apiNames =  new list<wrapper>();
        
        
        Map<String, Schema.SObjectType> schemaMap = Schema.getGlobalDescribe();
        Map<String, Schema.SObjectField> fieldMap=new  Map<String, Schema.SObjectField>();
        if(objName.contains('Account')){
            fieldMap= schemaMap.get('Account').getDescribe().fields.getMap(); 
			system.debug(fieldMap);
        }else if(objName.contains('Case')){
            fieldMap= schemaMap.get('Case').getDescribe().fields.getMap();   
        }else if(objName.contains('Contact')){
            fieldMap= schemaMap.get('Contact').getDescribe().fields.getMap();   
        }else if(objName.contains('Opportunity')){
            fieldMap= schemaMap.get('Opportunity').getDescribe().fields.getMap();   
        }
        
        for(String fieldName : fieldMap.keyset() )
        {
            system.debug('@@@@@@@'+fieldName); 
            //apiNames.add(fieldName);
            			           
			apiNames.add(new wrapper(fieldMap.get(fieldName).getDescribe().getLabel(),fieldMap.get(fieldName).getDescribe().getName()));
        }
        return json.serialize(apiNames);
    }
    public class wrapper{
        public string label;
        public string value;
        public wrapper(string lab,string val){
            label = lab;
            value = val;
            
        }
    }
    
}

controller.js

({
 myAction : function(component, event, helper) {
        var action = component.get('c.getPiklistValues');
        var t=document.getElementById("objectName").value;
        alert('object--'+t);
        action.setParams({
            objName : t,
        });
        action.setCallback(this,function(response){
            var responseValue = JSON.parse(response.getReturnValue());
                    console.log(responseValue);
            component.set("v.FieldsList",responseValue);
        });
        $A.enqueueAction(action);
    },
    handleSubmitChange: function (component, event, helper) {
        //alert('ok');
        var e = event.getParam("value");
        component.set("v.SelectedFieldsList", e);
    },
    getSelectedFields : function(component, event, helper){
        // alert('fine');
        var s = component.get("v.SelectedFieldsList");
        console.log('$$$$' , s);
    }
})


Hope this helps you
If this helps kindly mark it as solved so that it may help others in future.

Thanks and Regards
NitishNitish
Hi Ananya,

Every this is fine in code except the myAction method where we are setting the value of FieldList attribute.
Lightning:dualListbox accept the List with label and value. So to achive that we need to interate over returned value and need to push inside a List variable as a Label and Value. I have modified the myAction method and its working fine. Please find the code and let me know incase you have any doubt.

User-added image
 
({
    myAction : function(component, event, helper) {
           var action = component.get('c.getPiklistValues');
           var t=document.getElementById("objectName").value;
           alert('object--'+t);
           action.setParams({
               objName : t,
           });
           action.setCallback(this,function(response){
               var responseValue = response.getReturnValue();
                       console.log('return value--->'+responseValue);
              // component.set("v.FieldsList",responseValue);

               var setOption=[];

               for(var x in responseValue){
                  var opt = {
                       'value' : responseValue[x],
                        'label' : responseValue[x]
                   }

                   setOption.push(opt);
               }

               component.set("v.FieldsList",setOption);

              // console.log('getField--->'+component.get("v.FieldsList").length);
           });
           $A.enqueueAction(action);
       },
       handleSubmitChange: function (component, event, helper) {
           //alert('ok');
           var e = event.getParam("value");
           component.set("v.SelectedFieldsList", e);
       },
       getSelectedFields : function(component, event, helper){
           // alert('fine');
           var s = component.get("v.SelectedFieldsList");
           console.log('$$$$' , s);
       }
   })

Thanks,
Nitish
Chengdu sanjiChengdu sanji
the article is actually the best topic on this registry related issue. I fit in with your conclusions (https://www.firstsanji.com/product/smart-tool-cabinet/) and will eagerly look forward to your
next updates.
Ananya DhimanAnanya Dhiman

Thank you so much for your help guys.
NitishNitish
Hi Ananya,

As a best practice, If this helps kindly mark it as solved so that it may help other developers in future.

Thanks,
Nitish