+ Start a Discussion
George M AlbrechtGeorge M Albrecht 

Dynamic Dependent VF Page

Hello,

Trying to create a dynamic picklist on a VF page, running into issue on second picklist value populating dynamically. Can someone please help determine if its my query that is wrong or if I am not refreshing the VF page correctly to update picklist? Below are code snips:

public class employeeAwardPicklist {
    public string atype{get; set;}
    public string award{get; set;}
    public string denom{get; set;}
    public employeeAwardPicklist(ApexPages.StandardController controller) { }

//The type of giftcard for the first picklist option  
public list<selectoption> gettypes(){
    list<selectoption> options= new list<selectoption>();
    list<AggregateResult> atype= [select Type__c from Awards__c group by type__c order by type__c];
    options.add(new selectoption('—-Select CardType—-', '--Select CardType--'));
    for(AggregateResult t:atype){
     options.add(new selectoption(String.valueof(t.get('type__c')), String.valueof(t.get('type__c'))));
    }
    return options;
}

//The gift card name for the second picklist option   
public list<selectoption> getawards(){
    list<selectoption> options= new list<selectoption>();
    list<Awards__c> award= [SELECT name FROM Awards__c WHERE Awards__c.type__c =:atype];
    options.add(new selectoption('—-Select Award—-', '—-Select Award—-'));
    for( Awards__c a:award){
     options.add(new selectoption(a.name,a.name));
    }
    return options;
}

VF PAGE Section
<apex:pageBlock title="Employee Awards Edit">
  <apex:pageBlockButtons >
   <apex:commandButton action="{!save}" value="Save"/>
   <apex:commandButton action="{!cancel}" value="Cancel"/>
  </apex:pageBlockButtons>
  <apex:pageBlockSection title="Information">
   <apex:inputField value="{!Employee_Awards__c.Employee__c}"/>
  </apex:pageBlockSection>
  <apex:pageBlockSection title="Award Details" columns="2" >
<!--First picklist option Gift Card Type -->
   <apex:pageBlockSectionItem >
    <apex:outputLabel value="Gift Card Type"/>
    <apex:outputPanel styleClass="requiredInput" layout="block">
    <apex:outputPanel styleClass="requiredInput" layout="block"/>
     <apex:selectList size="1" value="{!atype}" >
      <apex:selectOptions value="{!types}" />
       <apex:actionSupport event="onchange" reRender="award"/>
     </apex:selectList>
    </apex:outputPanel>
   </apex:pageBlockSectionItem>
<!--Second picklist option Award Name -->
   <apex:pageBlockSectionItem >
    <apex:outputLabel value="Award"/>
     <apex:selectList size="1" value="{!award}"  id="award" >
      <apex:selectOptions value="{!awards}" />
       <apex:actionSupport event="onchange" reRender="denoms"/>
     </apex:selectList>
   </apex:pageBlockSectionItem>

Best Answer chosen by George M Albrecht
logontokartiklogontokartik
Hmm. Weird, can you try couple of things?

1. Move the output Panel above the apex:pageBlock and see 
<apex:outputPanel id="award">

<apex:pageBlock title="Employee Awards Edit">
  <apex:pageBlockButtons >
   <apex:commandButton action="{!save}" value="Save"/>
   <apex:commandButton action="{!cancel}" value="Cancel"/>
  </apex:pageBlockButtons>
  <apex:pageBlockSection title="Information">
   <apex:inputField value="{!Employee_Awards__c.Employee__c}"/>
  </apex:pageBlockSection>
  <apex:pageBlockSection title="Award Details" columns="2" >
<!--First picklist option Gift Card Type -->
   <apex:pageBlockSectionItem >
    <apex:outputLabel value="Gift Card Type"/>
    <apex:outputPanel styleClass="requiredInput" layout="block">
    <apex:outputPanel styleClass="requiredInput" layout="block"/>
     <apex:selectList size="1" value="{!atype}" >
      <apex:selectOptions value="{!types}" />
       <apex:actionSupport event="onchange" action="{!calculateAwards}" reRender="award"/>
     </apex:selectList>
    </apex:outputPanel>
   </apex:pageBlockSectionItem>
<!--Second picklist option Award Name -->

   <apex:pageBlockSectionItem >
    <apex:outputLabel value="Award"/>
     <apex:selectList size="1" value="{!award}"  id="awardList" >
      <apex:selectOptions value="{!awards}" />
       <apex:actionSupport event="onchange" reRender="denoms"/>
     </apex:selectList>
   </apex:pageBlockSectionItem>
....

</apex:outputPanel>

2. In your debug log, can you check the Awards__c SOQL to see if its returning any records.

Thank you


All Answers

logontokartiklogontokartik
Your code is not calling the getter in the right time, causing the rerender issues. Can you try the below and see if it works.

public class employeeAwardPicklist {
    public string atype{get; set;}
    public string award{get; set;}
    // Added awards as public variable, removed the getter.
    public List<SelectOption> awards {get;set;}
    public string denom{get; set;}
    public employeeAwardPicklist(ApexPages.StandardController controller) { }

//The type of giftcard for the first picklist option  
public list<selectoption> gettypes(){
    list<selectoption> options= new list<selectoption>();
    list<AggregateResult> atype= [select Type__c from Awards__c group by type__c order by type__c];
    options.add(new selectoption('', '--Select CardType--'));
    for(AggregateResult t:atype){
     options.add(new selectoption(String.valueof(t.get('type__c')), String.valueof(t.get('type__c'))));
    }
    return options;
}

// Use this method to get the 2nd picklist populated. This method is called everytime the first picklist is changed.
public void calculateAwards(){
   awards = new List<SelectOption>();
   if(atype == null || atype == ''){
      ApexPages.addMessage(new ApexPages.Message(ApexPages.Severity.Error, 'Select a Card Type'));
      return;
   }

   list<Awards__c> award= [SELECT name FROM Awards__c WHERE Awards__c.type__c =:atype];
   awards.add(new selectoption('—-Select Award—-', '—-Select Award—-'));
   for( Awards__c a:award){
     awards.add(new selectoption(a.name,a.name));
   }

}

The page I wrapped the 2nd picklist within OutputPanel so that there are no rendering issues

<apex:pageBlock title="Employee Awards Edit">
  <apex:pageBlockButtons >
   <apex:commandButton action="{!save}" value="Save"/>
   <apex:commandButton action="{!cancel}" value="Cancel"/>
  </apex:pageBlockButtons>
  <apex:pageBlockSection title="Information">
   <apex:inputField value="{!Employee_Awards__c.Employee__c}"/>
  </apex:pageBlockSection>
  <apex:pageBlockSection title="Award Details" columns="2" >
<!--First picklist option Gift Card Type -->
   <apex:pageBlockSectionItem >
    <apex:outputLabel value="Gift Card Type"/>
    <apex:outputPanel styleClass="requiredInput" layout="block">
    <apex:outputPanel styleClass="requiredInput" layout="block"/>
     <apex:selectList size="1" value="{!atype}" >
      <apex:selectOptions value="{!types}" />
       <apex:actionSupport event="onchange" action="{!calculateAwards}" reRender="award"/>
     </apex:selectList>
    </apex:outputPanel>
   </apex:pageBlockSectionItem>
<!--Second picklist option Award Name -->
   <apex:outputPanel id="award">
   <apex:pageBlockSectionItem >
    <apex:outputLabel value="Award"/>
     <apex:selectList size="1" value="{!award}"  id="awardList" >
      <apex:selectOptions value="{!awards}" />
       <apex:actionSupport event="onchange" reRender="denoms"/>
     </apex:selectList>
   </apex:pageBlockSectionItem>
   </apex:outputPanel>


George M AlbrechtGeorge M Albrecht
logontokartik,

Thanks for the suggestion, the help is much appreciated. Unfortunately no different result occured with the updated code...the VF page field "Award" did not contain any options now.
User-added image

Do you think there is something incorrect with SOQL query where its not correctly pulling what I'm looking for?

logontokartiklogontokartik
Hmm. Weird, can you try couple of things?

1. Move the output Panel above the apex:pageBlock and see 
<apex:outputPanel id="award">

<apex:pageBlock title="Employee Awards Edit">
  <apex:pageBlockButtons >
   <apex:commandButton action="{!save}" value="Save"/>
   <apex:commandButton action="{!cancel}" value="Cancel"/>
  </apex:pageBlockButtons>
  <apex:pageBlockSection title="Information">
   <apex:inputField value="{!Employee_Awards__c.Employee__c}"/>
  </apex:pageBlockSection>
  <apex:pageBlockSection title="Award Details" columns="2" >
<!--First picklist option Gift Card Type -->
   <apex:pageBlockSectionItem >
    <apex:outputLabel value="Gift Card Type"/>
    <apex:outputPanel styleClass="requiredInput" layout="block">
    <apex:outputPanel styleClass="requiredInput" layout="block"/>
     <apex:selectList size="1" value="{!atype}" >
      <apex:selectOptions value="{!types}" />
       <apex:actionSupport event="onchange" action="{!calculateAwards}" reRender="award"/>
     </apex:selectList>
    </apex:outputPanel>
   </apex:pageBlockSectionItem>
<!--Second picklist option Award Name -->

   <apex:pageBlockSectionItem >
    <apex:outputLabel value="Award"/>
     <apex:selectList size="1" value="{!award}"  id="awardList" >
      <apex:selectOptions value="{!awards}" />
       <apex:actionSupport event="onchange" reRender="denoms"/>
     </apex:selectList>
   </apex:pageBlockSectionItem>
....

</apex:outputPanel>

2. In your debug log, can you check the Awards__c SOQL to see if its returning any records.

Thank you


This was selected as the best answer
George M AlbrechtGeorge M Albrecht
That did it! You are a lifesave thank you!