function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
alockremalockrem 

How to update an outputLabel when a selectList changes

I have a collection of dependant selectLists on a Force.com page.  How can I populate an outputLabel with the price of the selection in the associated selectList?

 

Example:

SelectList1 - OutputLabel1

SelectList2 - OutputLabel2

SelectList3 - OutputLabel3

 

Note: I'm using the rerender action on each SelectList to update the next SelectList.  If your solution to my original question includes using the rerender action please also include instructions of how to use two rerenders on the same object.

 

Thank you for any assistance.

bob_buzzardbob_buzzard

Here's an example that I think answers your question.  The second and third picklists are initially empty, as are the chosen labels.  When the user picks an option for picklist 1, the chosen label is updated and the second picklist is populated.  Rerendering multiple areas can be achieved simply by providing a comma separated list to the rerender attribute of your action. 

 

Page:

 

 

<apex:page controller="PickListsController">
<h1>Picklists Page</h1>
<apex:form >
  <apex:pageBlock >
    <apex:pageBlockSection >
      <apex:pageBlockSectionItem >
        <apex:outputLabel value="Option 1"/>
        <apex:selectList value="{!selected1}">
          <apex:selectOptions value="{!list1SelectOptions}"/>
          <apex:actionSupport event="onchange" rerender="chosen_info1, list2"/>
        </apex:selectList>
      </apex:pageBlockSectionItem>
    </apex:pageBlockSection>
    <apex:pageBlockSection id="chosen_info1">
      <apex:pageBlockSectionItem >
         <apex:outputLabel value="Chosen"/>
         <apex:outputLabel value="{!selected1}"/>
      </apex:pageBlockSectionItem>
    </apex:pageBlockSection>
    <apex:pageBlockSection id="list2">
      <apex:pageBlockSectionItem >
        <apex:outputLabel value="Option 2"/>
        <apex:selectList value="{!selected2}">
          <apex:selectOptions value="{!list2SelectOptions}"/>
          <apex:actionSupport event="onchange" rerender="chosen_info2, list3"/>
        </apex:selectList>
      </apex:pageBlockSectionItem>
    </apex:pageBlockSection>
    <apex:pageBlockSection id="chosen_info2">
      <apex:pageBlockSectionItem >
         <apex:outputLabel value="Chosen"/>
         <apex:outputLabel value="{!selected2}"/>
      </apex:pageBlockSectionItem>
    </apex:pageBlockSection>
    <apex:pageBlockSection id="list3">
      <apex:pageBlockSectionItem >
        <apex:outputLabel value="Option 3"/>
        <apex:selectList value="{!selected3}">
          <apex:selectOptions value="{!list3SelectOptions}"/>
          <apex:actionSupport event="onchange" rerender="chosen_info3"/>
        </apex:selectList>
      </apex:pageBlockSectionItem>
    </apex:pageBlockSection>
    <apex:pageBlockSection id="chosen_info3">
      <apex:pageBlockSectionItem >
         <apex:outputLabel value="Chosen"/>
         <apex:outputLabel value="{!selected3}"/>
      </apex:pageBlockSectionItem>
    </apex:pageBlockSection>
  </apex:pageBlock>
</apex:form>
</apex:page>
 
 Controller:
 
public with sharing class PickListsController {

   public String selected1 {get; set;}
   public String selected2 {get; set;}
   public String selected3 {get; set;}
   
   
   public List<SelectOption> getList1SelectOptions()
   {
   	  List<SelectOption> options=new List<SelectOption>();
   	  options.add(new SelectOption('1 - First', '1 - First'));
   	  options.add(new SelectOption('1 - Second', '1 - Second'));
   	  return options;
   }
   
   public List<SelectOption> getList2SelectOptions()
   {
   	  List<SelectOption> options=new List<SelectOption>();
   	  if (null!=selected1)
   	  {
   	  options.add(new SelectOption('2 - First', '2 - First'));
   	  options.add(new SelectOption('2 - Second', '2 - Second'));
   	  }
   	  return options;
   }
   
   public List<SelectOption> getList3SelectOptions()
   {
   	  List<SelectOption> options=new List<SelectOption>();
   	  if (null!=selected2)
   	  {
   	  options.add(new SelectOption('3 - First', '3 - First'));
   	  options.add(new SelectOption('3 - Second', '3 - Second'));
   	  }
   	  return options;
   }
}
 
 
 
 
 
 
 


VeniVeni


bob_buzzardbob_buzzard
You can mark it as a solution if you like ;)