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
gdkgdk 

rendering a table from a value selected in Picklist

hi,

 I created 2 custom objects with lookuprelation,

i placed a picklist on vfpage and i placed related field values in that picklist,

i want to display table when i select a value from picklist , plese help 

AditiSFDCAditiSFDC

Hi,

 

 

You can either use Javascript and CSS to display the hidden table. Adding some sample code:

 

	<script>
      function checkValue(val) {
		if(val == '3') {
           document.getElementById('rerenderTable').style.display = '' ;
        }
      } 
    </script>
	
	

	<apex:selectList onchange="checkValue(this.value);" size="1">
		<apex:selectOption itemLabel="--" itemValue="--"></apex:selectOption>
        <apex:selectOption itemLabel="1" itemValue="1"></apex:selectOption>
        <apex:selectOption itemLabel="2" itemValue="2"></apex:selectOption>
        <apex:selectOption itemLabel="3" itemValue="3"></apex:selectOption>
    </apex:selectList>
 
    <br/><br/>
    <div id="rerenderTable" style="display: none;">
        Table Content
    </div>

 

 

Or use actionFunction to rerender a particular section.

 

<apex:actionFunction action="{!toggleVariable}" name="rerenderTable" reRender="tablePanel" status="statusId"/>
      <apex:selectList onchange="if(this.value == '3'){rerenderTable(); };" size="1">
          <apex:selectOption itemLabel="--" itemValue="--"></apex:selectOption>
          <apex:selectOption itemLabel="1" itemValue="1"></apex:selectOption>
          <apex:selectOption itemLabel="2" itemValue="2"></apex:selectOption>
          <apex:selectOption itemLabel="3" itemValue="3"></apex:selectOption>
      </apex:selectList>
      
      <br/><br/>
      <apex:actionStatus id="statusId" startText="Loading...."></apex:actionStatus>
      
      <br/>
      <apex:outputPanel id="tablePanel" >
          <apex:outputPanel rendered="{!displayTable}" >
              Table Content
          </apex:outputPanel>
      </apex:outputPanel>



Class Code:

    public Boolean displayTable {get; set;}
    
    public TestPageController () {
        displayTable = false ;
    }
    public void toggleVariable() {
        displayTable = true;
    }