This should be simple... I guess. I would like to display the fields of an Object record in one column (one below other) in a visualforce page. That is:

-Company Name- -ABC Company-
-Address- -123 Main St-
-Field 3 Description- -Field 3 Value-
-Field 4 Description- -Field 4 Value-
Similar to like how Salesforce displays in its native pages.

Currently I have all the field descriptions hardcoded as headers in a apex:column along with its value. It displays the data, but two problems:
1. It displays all the field values in one ROW with descriptions as headers.
2. I hate to hardcode the field descriptions. Is there a way to programmatically pull that value? That is, if {Obj.field_value__c} pulls the value of the specified field, what is the syntax to pull its corresponding field description from Salesforce?

I would like to do this in a PageBlockTable, of course not using BR and TABLE tags. I am sure there is a cleaner way to do this... can someone tell me how?

EDIT: How to set the width to 100% when there are more than one such pageBlocks in a single row?

enter image description here

  • Do you have a custom controller cause you will need on. You can create a wrapper that stores the field description and value and then display it in a table using <apex:repeat>. What code do you have so far? You could also use a pageblockSection and set the column to 1 in order to display the field label and value in a single row – Eric Feb 20 '15 at 3:37

I think you're confused with your tags... <apex:pageBlockTable> is used for tables, for the regular UI style layout you want <apex:pageBlock> and <apex:pageBlockSection>.

Note the use of columns="1" in the section to get the layout you're after, and using <apex:outputField> takes care of the field label for us too. You'll need to use the right merge fields of course, but this should get you where you want to go:

<apex:pageBlock title="The Details">
  <apex:pageBlockSection columns="1">
    <apex:outputField value="{!Obj.Name}"/>
    <apex:outputField value="{!Obj.Address__c}"/>
    <apex:outputField value="{!Obj.Field_3__c}"/>
    <apex:outputField value="{!Obj.Field_4__c}"/>
| improve this answer | |
  • Perfect! I should have mentioned that I am a Salesforce rookie :) – Lightning Evangelist Feb 20 '15 at 15:18
  • On that note... I now have three such pageBlocks side-by-side. The field description is wrapping unnecessarily when there is quite some space after the field value. My point is, I would like the pageBlock to be relaxed (width = 100%), but neither pageBlock nor pageBlockSection support the width attribute. How could I accomplish that? See screenshot in OP. – Lightning Evangelist Feb 20 '15 at 15:59
  • Nevermind... I fixed it with tr and td tags. Thanks. – Lightning Evangelist Feb 20 '15 at 19:30
  • Sorry about that, didn't see the comments until now! You're right though, the standard UI only supports pageblocks at 100% width. When I've needed to do multiple I've either used a table like you say, or I've used the styleClass attribute to specify a CSS class which fixes the width. – Matt Lacey Feb 21 '15 at 6:05

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.