Friday, April 30, 2010

How to use rowClasses in a dataTable or PageBlockTable in VisualForce

Scenario:
 To have a table that would shade each alternative row.

Solution:
In your css file or even in the visualforce page place in the following:
  1. In CSS:
    1. .odd {
      background-color: #FCF7F7;
      }
      .even {
      background-color: #E3DCDB;
      }
  2. Inside the VF Page:
So the Apex Visualforce page would look like this:
                <apex:page standardcontroller="Contact">
                <apex:form id="reportform"> <!-- Start of ReportForm-->
                <apex:dataTable value="{!queryResult}" var="r" id="       ttable" border="0" rowClasses="even,odd">
                 <!--yourcode here-->
                 </apex:dataTable>
                 </apex:form>
                 </apex:page>

Now you have each other row shaded gray/white.
Thanks
Check out my Other Salesforce.com Blogs
Salesforce Made Easy
Salesforce Data Migration Made Easy
eTechCareers.com Coming Soon

1 comment: