Salesforce Visualforce Page workaround for apex:pageBlockSection not collapsible within apex:repeat
Visualforce provides us with many tools and components to quickly setup a page with high degree of similarity in style with Salesforce UI look and feel.
One of such is the pageBlockSection, which as the name hint is often used to create a section within the Visualforce Page that we intend to display, ex:
<apex:pageBlockSection title="Test Section"> ... </apex:pageBlockSection>
Much like the way Salesforce own UI pageBlockSection behave, this section can be toggled between a collapsed state where it only display the title of the section, ex:
or unfolded into it’s deployed state where it display the content of the section as well as the title..
These are standard capability of the pageBlockSection itself, but as of the time of this writing a problem exist when we attempt to use pageBlockSection while enclosing it within a repeat component, ex:
<apex:repeat> <apex:pageBlockSection title="Test Section"> ... </apex:pageBlockSection> </apex:repeat>
The above code will break the collapsible feature of pageBlockSection, locking it in unfolded state.
A workaround to this problem is to include a dummy pageBlockSection prior to the repeat component, this dummy pageBlockSection can be hidden and it will remain functional, so to fix our example above:
<apex:pageBlockSection title="Title" collapsible="true" rendered="false"/> <apex:repeat> <apex:pageBlockSection title="Test Section"> ... </apex:pageBlockSection> </apex:repeat>