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
Victoria UkatuVictoria Ukatu 

Conditionally render Visualforce page based on picklist selection

Hi all,

I'm wondering how to conditionally render my Visualforce page based on the user's picklist selection. My picklist looks like this 
<div class="slds-combobox-container" style="padding: 15px;">
         <apex:form >
             <apex:selectList value="{!selectedList}" size="1" styleClass="slds-select">
                 <apex:selectOptions value="{!listOptions}"></apex:selectOptions>
             </apex:selectList>
         </apex:form>
     </div>
where the user can choose Option A, Option B, or Option C. If they select Option A, I only want the records related to Option A to display, and the same idea with the other options. Right now all of the records are being displayed on the VF page regardless of which option I select. I know that there are answers out there related to picklists, but none that quite addressed this issue. 

Thanks!
 
Best Answer chosen by Victoria Ukatu
Victoria UkatuVictoria Ukatu
Thanks Abhishek, but I was able to resolve it already. Inside of the apex:selectList, I added  
<apex:actionSupport  event="onchange" rerender="display, tableofcontents"></apex:actionSupport>

where display and tableofcontents are the id's of containers which contain the two parts of the page I want to re-render, e.g.  
<apex:outPutPanel rendered="true" id="tableofcontents">

<!-- part that I want to re-render upon dropdown selection -->

</apex:outPutPanel>
And then in my Apex controller, within the get method which retrieves all of the data that I want to display, in the WHERE clause of my SOQL statement I set the lookup field between the Options and the display data equal to the variable which contains the id's of Option A, B, and C.  
SELECT Id, Name FROM Data_To_Display__c  WHERE Lookup_Field__c =:selectedList

This was the key part that I was missing. In order for the page to know what data to conditionally render, I need to provide the id from the selection I chose from the dropdown.

If anyone is curious in the future about the full code I can go into more detail, but it was a pretty simple fix!

All Answers

AbhishekAbhishek (Salesforce Developers) 
https://help.salesforce.com/articleView?id=000324662&type=1&mode=1

Check the suggestions as mentioned in the above official article.


If it helps you and close your query by marking it as solved so that it can help others in the future.

Thanks.
Victoria UkatuVictoria Ukatu
Thanks Abhishek, but I was able to resolve it already. Inside of the apex:selectList, I added  
<apex:actionSupport  event="onchange" rerender="display, tableofcontents"></apex:actionSupport>

where display and tableofcontents are the id's of containers which contain the two parts of the page I want to re-render, e.g.  
<apex:outPutPanel rendered="true" id="tableofcontents">

<!-- part that I want to re-render upon dropdown selection -->

</apex:outPutPanel>
And then in my Apex controller, within the get method which retrieves all of the data that I want to display, in the WHERE clause of my SOQL statement I set the lookup field between the Options and the display data equal to the variable which contains the id's of Option A, B, and C.  
SELECT Id, Name FROM Data_To_Display__c  WHERE Lookup_Field__c =:selectedList

This was the key part that I was missing. In order for the page to know what data to conditionally render, I need to provide the id from the selection I chose from the dropdown.

If anyone is curious in the future about the full code I can go into more detail, but it was a pretty simple fix!
This was selected as the best answer