Find your content:

Search form

You are here

How to put a border around a group of datatables

 
Share

I have 3 <apex:dataTable> in my component. I'd like to put a border around all 3. I'm not getting it however. Any suggestions?

<apex:component access="global" controller="myCont">
    <apex:attribute assignTo="{!custId}" description="The SF ID" id="custId" name="custIDFromEmail" type="String"/>
    <br/>

    <apex:dataTable bgcolor="EEEEEE" border="below" cellspacing="5%" columnsWidth="30%" value="{!innerClassFieldList}" var="c" width="70%">
        <apex:facet name="header">Information</apex:facet>
        <apex:column value="{!c.label}">
            <apex:facet name="header">Field Name</apex:facet>
        </apex:column>
        <apex:column value="{!c.value}">
            <apex:facet name="header">Value</apex:facet>
        </apex:column>
    </apex:dataTable>
    <br/><br/><br/>

    <apex:dataTable border="below" cellspacing="5%" columnsWidth="30%" rendered="{!updateArrayLabelSize}" value="{!updateArrLabels}" var="c" width="70%">
        <apex:facet name="header">Additions / Updates</apex:facet>
        <apex:column value="{!$ObjectType.Customization__c.fields[c].label}">
            <apex:facet name="header">Field Name</apex:facet>
        </apex:column>
        <apex:column value="{!myCust[c]}">
            <apex:facet name="header">Value</apex:facet>
        </apex:column>
    </apex:dataTable>
    <br/><br/><br/>

    <apex:dataTable bgcolor="EEEEEE" border="below" cellspacing="5%" columnsWidth="30%" rendered="{!deleteArrayLabelSize}" value="{!delArrLabels}" var="c" width="70%">
        <apex:facet name="header">Remove</apex:facet>
        <apex:column value="{!$ObjectType.Customization__c.fields[c].label}"/>
    </apex:dataTable>
</apex:component>

Attribution to: PartOfTheOhana

Possible Suggestion/Solution #1

The apex:dataTable border attribute is a number of pixels not a string so replace "below" with a numeric value such as "1".

To gain access to the more flexible CSS styling, use the style and styleClass attributes.


Attribution to: Keith C

Possible Suggestion/Solution #2

You could enclose all three of your tables inside of one pair of div tags, and apply a border to the div using CSS. You may need to add a clearFix class to your div in order for the border to surround all three, but I'm not 100% sure that will be necessary.


Attribution to: Kyle
This content is remixed from stackoverflow or stackexchange. Please visit https://salesforce.stackexchange.com/questions/34126

My Block Status

My Block Content