Sign Up ›

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

VF Column Sub-Headers within a Section (not a facet)

I have been looking for hours over the past few weeks for a solution to what I think must be a common issue. My client is requesting that I change a custom object to display two columns (ok, got it) but need headers to designate column 1 as "Standard" and column 2 as "Unique". Ideally, these would be headers within the section. I would prefer to go declarative, but this isn't possible, unless I use the FLS "read-only" trick. The problem with this is that it looks awful, and I need to repeat it for many different sections. I suggest to just go with actual sections labeled differently (much less work), but the client is insistent on utilizing sub-headers. 

Does anyone know this can be accomplished using VF? The only information I can find is in regards to apex:dataTable, but I do not actually need a table, just the layout. 

Note: The image shows only column 1 with a subheader, but need a subheader for both columns. 
User-added image
Best Answer chosen by jleeh
James LoghryJames Loghry
Have a look into PageBlock / PageBlockSection.  You should be able to get (most of the way there).

Here's a snippet  of what your Visualforce markup may look like:

<apex:page showHeader="true" sidebar="true" standardController="Account">
	<apex:form>
		<apex:pageBlock title="{!$Label.PageBlockHeader}">
			<apex:pageBlockSection columns="2">
				<apex:pageBlockSection columns="1" title="{!$Label.Standard" collapsible="false">
					<apex:inputField value="{!Account.Name}" />
				</apex:pageBlockSection>
				<apex:pageBlockSection columns="1" title="{!$Label.Unique}" collapsible="false">
					<apex:inputField value="{!Account.Active__c}" />
				</apex:pageBlockSection>
			</apex:pageBlockSection>
		</apex:pageBlock>
	</apex:form>
</apex:page>

All Answers

James LoghryJames Loghry
Have a look into PageBlock / PageBlockSection.  You should be able to get (most of the way there).

Here's a snippet  of what your Visualforce markup may look like:

<apex:page showHeader="true" sidebar="true" standardController="Account">
	<apex:form>
		<apex:pageBlock title="{!$Label.PageBlockHeader}">
			<apex:pageBlockSection columns="2">
				<apex:pageBlockSection columns="1" title="{!$Label.Standard" collapsible="false">
					<apex:inputField value="{!Account.Name}" />
				</apex:pageBlockSection>
				<apex:pageBlockSection columns="1" title="{!$Label.Unique}" collapsible="false">
					<apex:inputField value="{!Account.Active__c}" />
				</apex:pageBlockSection>
			</apex:pageBlockSection>
		</apex:pageBlock>
	</apex:form>
</apex:page>


This was selected as the best answer
jleehjleeh
Hi James - this is exactly what I need. Thanks!