custom dependent picklist

Custom Dependent Picklist Field With lightning:select In Lightning Component

Lightning Component

Hey guys, today in this post we are going to create a new updated version of Custom Dependent Picklist fields using ‘lightning:select‘ base component in salesforce.

custom-dependent-picklist lightning

Prerequisites : basic understanding of Lightning Component & apex Programming
Step  0 : Setup Picklist field dependency

In this post , first we have create 2 custom picklist fields on salesforce  standard Contact object

Country__c &  City__c

then set field dependency. here country is the controller field  and city is the dependent field.

Custom dependent picklist salesforce sfdcmonkey

Step  1 : Create apex controller
[dependentPicklist_UpdateCtrl.apxc]

  • you don’t need to change anything in above apex classes.
Step  2 : Create Lightning Component
DependentPicklist.cmp

DependentPicklistController.js

Check also :  Custom Multi-Select Picklist In Lightning Component With Select2 jQuery Plugin
DependentPicklistHelper.js

 

  • check above code comments.
  • You just need to change the object API Name/Type on line number 15.[DependentPicklist.cmp].
  • And change dependent field and controller field API Names on line number 16 – 17.[DependentPicklist.cmp].

TestApp.app

want to create 3 level picklist field dependency ? check example here 

Like our facebook page for new post updates.? & Don’t forget to bookmark this site for your future reference.

 Let us know if it helps you 🙂

people also check : How to use SVG in Salesforce Lightning Component ?

 

(Visited 21,764 times, 1 visits today)

20 comments

  • Hi,

    Thanks a lot for this component. Its really helpful!

    I need to store the values of the above component details along with another component values by clicking on save button. May I know how this can be achieved please!

    Thanks in advance:)

  • Hi Piyush,

    This is great, thanks! How would you adapt this code to include two dependent picklist fields being controlled by the same controlling picklist field on the same form?

  • i copied the code and all done but i am not getting the values in both controlled and dependant field,

    here i changed the field api names as country__  c  and city__c,

    still i am not getting the values.

    can you please help me in this

  • I want to create dependent picklist having three dependent columns and it should applies independently on multiple rows. It means picklist fields in Columns are dependent but picklist fields in rows are not dependent to each other .I use the code given in http://sfdcmonkey.com/2018/08/31/dependent-picklist-lightningselect-lightning-salesforce/ , but it makes rows also dependent on each other. Please help if any one has code for this.

    This is my component code:

    <aura:iteration items=”{!v.NewoperationalApproverData}” var=”OperationalAPProver” indexVar=”rowIndex”>
    <tr class=”slds-text-title_caps”>
    <td>

    {!rowIndex + 1}

  • I want to create dependent picklist having three dependent columns and it should applies independently on multiple rows. It means picklist fields in Columns are dependent but picklist fields in rows are not dependent to each other .I use the code given in http://sfdcmonkey.com/2018/08/31/dependent-picklist-lightningselect-lightning-salesforce/ , but it makes rows also dependent on each other. Please help if any one has code for this.

    The following is my  code component:

    <aura:iteration items=”{!v.NewoperationalApproverData}” var=”OperationalAPProver” indexVar=”rowIndex”>
    <tr class=”slds-text-title_caps”>
    <td>

    {!rowIndex + 1}

  • Thanks for the above code, It working on lightning app but I want to use this in flow, it not working as expected. In the apex class(dependentPicklist_UpdateCtrl) I am getting  the bit = 0 (for (Integer i = 0; i < validForBits.length(); i++) {
    String bit = validForBits.mid(i, 1);
    system.debug(‘bit*******’+bit);
    if (bit == ‘1’) {
    objResults.get(controllingValues.get(i)).add(label);
    system.debug(‘objResults*******’+objResults);
    })

    few times I am getting bit =1 and sometimes 0, so values are not getting into the picklist.

    Can you please help me.

    Thanks,

    Swetha.

  • hi,
    i AM not getting dependent picklist value it remain disabled all the time .anyone suggest what may be the problem.

    thanks

  • Is this different than the standard “Dependent Picklists” Lightning Component that Salesforce provides?

    I’m using that one but running into an issue where I want to set Picklist 2 to be required only if it actually shows (ie the value in Picklist 1 is such that there are actually options for picklist 2). But the “Required” attribute doesn’t seem to care if the field is showing or not so it’s required even if you can’t populate it.

     

    I’ll give this one a whirl and maybe it’ll handle that functionality better. Thanks in advance.

  • Hi,

    Thanks for your help, this is fabulous.

    I have tried to make this with the standard countries/state picklist and I am not able to get any picklist values back? I wonder if it’s even possible?

    thanks!

  • Hi,

    thanks for your help. I am trying to do this with the normal country/state picklist values, but it does not return any values back. Id this even possible?

     

    thanks,

  • 1)In Home page.

    I want one picklist field Branches.In Branches values are Chennai,Bangalore,Mumbai,kochi etc, Whenever i select Chennai Branch,i want to display all Chennai Branch salesperson date Like Name ,Target amount and achieved amount.

    2) In same page you want to display one more picklist field salesperson Name. whenever i select particular salesperson name ,i want to display that person information like Name, Target amount and achieved amount.

    for emaple: first picklist i selected chennai means in second picklist  will show only chennai salesperson name

    in first picklist you are not selected any option means in second picklist i want to show all salesperson information  when ever  i select particular salesperson name  i want to show particular persons name, total target and achieve amount

Leave a Reply