create dependent picklist between Account and Contact in salesforce

 //Apex Class:- "customPickListController" 
public class customPickListController {
    public List < SelectOption > lstAccntName {get;set;}
    public List < SelectOption > lstcnctoption { get;set;}
    public string accid { get;set;}
    public customPickListController() {
        bindCustomPicklist();
        lstcnctoption = new List < SelectOption > ();
        lstcnctoption.add(new SelectOption('0', 'No Data'));
    }

    public PageReference bindCustomPicklist() {
        lstAccntName = new List < SelectOption > ();

        List < Account > lstacc = [select id, Name from Account];
        system.debug('<<<<lstacc>>>>' + lstacc);
        if (lstacc.size() > 0) {

            lstAccntName.add(new SelectOption('0', '--Select--'));
            for (Account acc: lstacc) {
                system.debug('<<<<acc.id>>>>' + acc.id);
                system.debug('<<<<acc.Name>>>>' + acc.Name);
                lstAccntName.add(new SelectOption(acc.id, acc.Name));
            }

        }
        system.debug('<<<<lstAccntName>>>>' + lstAccntName);

        return null;
    }


    public PageReference getContactDetails() {
        system.debug('<<<<accid>>>>' + accid);
        List < contact > lstcnct = [select id, lastname from contact where accountid =: accid];
        system.debug('<<<<lstcnct>>>>' + lstcnct);
        lstcnctoption = new List < SelectOption > ();
        if (lstcnct.size() > 0) {
            lstcnctoption.clear();
            for (contact cnct: lstcnct) {
                system.debug('<<<<cnct.id>>>>' + cnct.id);
                system.debug('<<<<cnct.lastname>>>>' + cnct.lastname);
                lstcnctoption.add(new SelectOption(cnct.id, cnct.lastname));
            }

        } else {
            lstcnctoption.clear();
            lstcnctoption.add(new SelectOption('0', 'No Data'));
        }
        system.debug('<<<<lstcnctoption>>>>' + lstcnctoption);
        return null;
    }

}
//VisualForce Page:- "CustomPicklistExample"
<apex:page id="pageid" controller="customPickListController" >
    <apex:form id="frmid">
    <script>
        function selectAccount()
        {
            debugger;
            var el = document.getElementById("pageid:frmid:j_id3:j_id4:AccntId00:picklistvalid");
            var value = el.options[el.selectedIndex].value;
            var text = el.options[el.selectedIndex].text;         
            //alert(value +"   "+ text);
            methodOneInJavascript(value);          
        }
    
    </script>   
      
        <apex:actionFunction action="{!getContactDetails }" name="methodOneInJavascript" rerender="Account001,cnct001" status="">
            <apex:param name="firstParam" assignTo="{!accid}" value="" />
        </apex:actionFunction>
    
    
        <apex:pageBlock title="Custom PickList Demo" mode="edit">        
            <apex:pageBlockSection title="Custom Picklist Using selectList and selectOption" columns="1">    
            
            <apex:outputPanel id="Account001">          
            <apex:pageblockSectionItem id="AccntId00">
                <apex:outputLabel id="AccntId" value="Account"/>
                  <apex:selectList size="1"  style="width:10%" id="picklistvalid" onchange="selectAccount();">                               
                    <apex:selectOptions value="{!lstAccntName}" id="picklistID"/> 
                </apex:selectList>   
            </apex:pageblockSectionItem>   
            </apex:outputPanel> 

           <apex:outputPanel id="cnct001"> 
               <apex:pageblockSectionItem id="cnct">
                    <apex:outputLabel value="Contact LastName"/>
                      <apex:selectList size="1"  style="width:10%" id="picklistcnctId" >                               
                        <apex:selectOptions value="{!lstcnctoption}" id="picklistCnct1"/> 
                    </apex:selectList> 
                 </apex:pageblockSectionItem> 
                </apex:outputPanel> 
                 </apex:pageBlockSection>
                 
           </apex:pageBlock> 
                
    </apex:form>
     
</apex:page>
             

OutPut:-

Leave a Reply