I am having trouble getting an apex:pageBlockSection to rerender from an apex:actionFunction call if the section is initially not rendered.

My goal is to initially hide a section when the page is rendered, but once the action function is called, I would like for the hidden section to render to the page.

When reviewing the Debug logs, I can see that the toggle variable seems to have the correct value (false for the first pass, and true once the action function completes).

I have provided a simplified version of what my page and class look like.

Extension Class

public with sharing class CustomObjectExtension
    private Boolean theToggleVal = false;
    public Boolean ParamToggle { get; set; }

    public void DoToggle() {
        theToggleVal = ParamToggle;

    public Boolean ShouldDisplay {
        get {
            return theToggleVal;

Visualforce Page

<apex:page standardController="CustomObject__c" extensions="CustomObjectExtension">
    <script src="/soap/ajax/20.0/connection.js" type="text/javascript"></script>
        <apex:actionFunction name="ToggleSection" action="{!DoToggle}" rerender="theDynamicSection" immediate="true">
            <apex:param name="ParamToggle" assignTo="{!ParamToggle}" value="" />
        <apex:pageBlock title="Personal Card Edit" mode="edit" id="thePageBlock">
            <apex:pageBlockSection collapsible="false" columns="1" title="Always Visible Section">

                        <div onclick="callToggleSection()">Click Me</div>
                        <script type="text/javascript">
                            function callToggleSection()


            <apex:pageBlockSection collapsible="false" columns="1" title="The Dynamic Section" id="theDynamicSection" rendered="{!ShouldDisplay == true}">
                    <div>Now you see me</div>

How can an apex:pageBlockSection be rerendered if it originally has a render value of false?

3 Answers 3


I've found before that if it's set to false when the page first renders then the element doesn't actually exist, so it's not technically a valid rerender target.

I've found the easiest way is to wrap your block in another element and rerender that instead:

<apex:variable var="v" value="" id="rerenderThis">
    <apex:pageBlockSection collapsible="false" columns="1" title="The Dynamic Section" id="theDynamicSection" rendered="{!ShouldDisplay == true}">
            <div>Now you see me</div>
  • I wrapped my apex:pageBlockSection in an apex:outputPanel and it it worked great. Thanks! Commented Aug 17, 2012 at 13:26

Wrap your pageblocksection in a div with the id="theDynamicSection". This allows you to do the rerender independent of the rendered formula result.

  • 1
    Or apex:outputPanels. Commented Aug 17, 2012 at 1:53
  • @PeterKnolle Using the apex:outputPanel did the trick. Thanks for the tip. Commented Aug 17, 2012 at 13:30

Wrapping the apex:pageBlockSection works well, like others have suggested. However, I've also seen cases in Visualforce where the rendered attribute, especially in conjunction with ==, >, or < operators performs unexpectedly. I would modify your rendered attribute to be just {!ShouldDisplay} or if you could go one step further with {!IF(ShouldDisplay,true,false)}

  • Thanks for the suggestion. I had not seen the IF function before. Commented Aug 17, 2012 at 16:28

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .