[SalesForce] Lightning Service component for picklist values

I am trying to create a service component as illustrated in Trailhead

https://trailhead.salesforce.com/trails/lex_dev/projects/workshop-override-standard-action/steps/override_2

In this module it was given for one field which works beautifully. But let's say I have 5 different picklist fields on the Lightning component UI. So in that situation I am trying accomplish the concept but stuck in how to define the aura:attribute. If I define the way it is given here it is retrieving the values for the last called "v.picklistValues" for all of the fields.

    <***** Picklist Component******>
<aura:component controller="PickListController" access="global" description="PickListValues">
    <aura:handler name="init" value="{!this}" action="{!c.doInit}" />
    <aura:attribute name="sObjectName" type="String" />
    <aura:attribute name="fieldName" type="String" />
    <aura:attribute name="picklistValues" type="Object" />
</aura:component>

****Picklist Controller****
({  
    doInit : function(component) {
        var action = component.get("c.getPickListValuesIntoList");
        action.setParams({
            objectType: component.get("v.sObjectName"),
            selectedField: component.get("v.fieldName")
        });
        action.setCallback(this, function(response) {
            var list = response.getReturnValue();
            component.set("v.picklistValues", list);
        })
        $A.enqueueAction(action);
    }
})
    <***** Parent Component calling Picklist component******>
<c:PicklistValues sObjectName="Executive_Snapshot__c" fieldName="Field1" picklistValues="{!v.picklistValues}" />
<c:PicklistValues sObjectName="Executive_Snapshot__c" fieldName="Field2" picklistValues="{!v.picklistValues}" />

Best Answer

When you add following code

<c:PicklistValues sObjectName="Opportunity" fieldName="StageName" picklistValues="{!v.picklistValues}" />

you are passing picklistValues attribute from parent component

<aura:attribute name="picklistValues" type="Object" />

so if you want to add another one add another parent component attribute and pass that as parameter

<aura:attribute name="secondpicklistValues" type="Object" />

your component will look like this

<aura:component >
        <aura:attribute name="picklistValues" type="Object" />
        <aura:attribute name="secondpicklistValues" type="Object" />
        <c:PicklistValues sObjectName="Executive_Snapshot__c" fieldName="Field1" picklistValues="{!v.picklistValues}" />
<c:PicklistValues sObjectName="Executive_Snapshot__c" fieldName="Field2" picklistValues="{!v.secondpicklistValues}" />
</aura:component>

Related Solutions

[SalesForce] component.get(v.body) not working as expected

@Praveen, yes, this is totally normal. Here is what is happening:

When we say that the body attribute is defined on all components we mean that it's defined on the base <aura:component/> from which all components inherit. Here is a simplified version.

<aura:component/>
   <aura:attribute name="body" type="Aura.Component[]"/>
   {!v.body}
</aura:component>

As you can see, the base component outputs the body tag that it receives in its own body, otherwise, nothing would be rendered. Angular calls that process "transclusion", the inclusion of content from another context.

When you write this:

<aura:component>
    <div>Body part</div>
    <ui:button label="Push Me" press="{!c.printCmpBody}"/>
</aura:component>

You are setting the body tag of the parent component. Everything defined in your component is the "lexical definition", and it's passed to its parent. If you want to read it, you could use cmp.getSuper().get("v.body") but it's a deprecated API, and it will probably not work. However, that's the idea behind it.

Why is it working like this? Let's call your component c:myComponent and use it inside an app:

<c:myComponent>
   <i>Instance Part</i>
</c:myComponent>

This is equivalent to this format:

<c:myComponent>
    <aura:set attribute="body>
       <i>Hello</i>
    </aura:set>
<c:myComponent>

As you see, every component needs to receive an attribute body independently of what it defines internally. You can try this format, it does work, but it's unnecessary except to illustrate how to set the body of a component.

Now, your component can ignore its body attribute as in your original code, or it can use it like this:

<aura:component>
    <div>Body part</div>
    {!v.body}
    <ui:button label="Push Me" press="{!c.printCmpBody}"/>
</aura:component>

You can place the expression {!v.body} anywhere you want.

The rendered content will then be equal to the instance's v.body plus the component-defined lexical definition:

v.body = <i>Instance Part</i>
+
lexical scope = <div>Body part</div>{!v.body}...
=
Rendered: <div>Body part</div><i>Instance Part</i>...

You can get more information on how the attribute body works by looking at slides 24, 25, and 27:

Mastering the Lightning Framework - Part 1

And the explications are at around 15:00 minute here:

Mastering the Lightning Framework - Part 1

[SalesForce] Lightning – retrieve picklist values available for RecordType

You can now use the UI API from your lightning component's apex controller to retrieve this information. It's not ideal because you have to use an API call into your own org, but at least it is now possible.

See the salesforce documentation on the UI API here.

The callout would be /ui-api/object-info/{objectApiName}/picklist-values/{recordTypeId}/{fieldApiName}. This retrieves picklist values based on the record type ID you pass it.

Best Answer

Related Solutions

[SalesForce] component.get(v.body) not working as expected

[SalesForce] Lightning – retrieve picklist values available for RecordType

Related Topic