Sign Up ›

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

Need to set Backcolor of cell

Hello,

 

I'm working on creating my first visual force page.  Here is my code:

<apex:page controller="clsProjectOverview">
    <apex:pageBlock >
        <apex:pageblocktable value="{!milestones}"  var="m">
            <apex:column headervalue="Milestones">
                <apex:outputtext value="{!m.Name}"/>
            </apex:column>
            <apex:column >
                   <apex:facet name="header">                                        
                         Actions                                                                               
                    </apex:facet>
                    <apex:pageblocktable value="{!m.Actions__r}" var="a"  cellpadding="5">
                        <apex:column headerValue="Action Name">
                               <apex:outputText value="{!a.Name}"/>
                         </apex:column>
                        <apex:column headerValue="Status" >
                            <apex:outputText value="{!a.Status__c}" style="{!IF((a.Status__c='Planned'),'background-color:red','background-color:green')}"  />
                            </apex:column>
                        <apex:column headerValue="Start Date">
                               <apex:outputText value="{!a.Start_Date__c}"/>
                         </apex:column>
                        <apex:column headerValue="End Date">
                               <apex:outputText value="{!a.End_Date__c}"/>
                         </apex:column>
                    </apex:pageblocktable>
            </apex:column>
        </apex:pageblocktable>
    </apex:pageBlock>
</apex:page>

 

As you can see, I'm trying to set the color of an output text field.  This is working, but the color only applies to the text.  It would look much better if the full cell was the back-color I wanted.

 

How can I accomplish this?  If I put <td> and </td> before/after my output text field, it works, but it moves the values over one column to the right.

 

Any suggestions?

 

Thanks

Shiv ShankarShiv Shankar
you want to change the color of table cell, or input text background ?
mnickelsmnickels

Hello Shiv,

 

I'm trying to output text from a soql query (changing the value is not a requirement). I want to change the background color of the entire table cell, but changing the background color of apex:outputText only highlights my text (whereas I want the entire cell to change backcolor).

 

Thanks,

 

Mike
Adam HowarthAdam Howarth

Hey,

 

You're code is nearly correct.

 

I just tested this out and it works if you do this:

 

<apex:page controller="clsProjectOverview">
    <apex:pageBlock >
        <apex:pageblocktable value="{!milestones}"  var="m">
            <apex:column headervalue="Milestones">
                <apex:outputtext value="{!m.Name}"/>
            </apex:column>
            <apex:column >
                   <apex:facet name="header">                                        
                         Actions                                                                               
                    </apex:facet>
                    <apex:pageblocktable value="{!m.Actions__r}" var="a"  cellpadding="5">
                        <apex:column headerValue="Action Name">
                               <apex:outputText value="{!a.Name}"/>
                         </apex:column>
                        <apex:column headerValue="Status" style="{!IF((a.Status__c='Planned'),'background-color:red','background-color:green')}">
                            <apex:outputText value="{!a.Status__c}" />
                            </apex:column>
                        <apex:column headerValue="Start Date">
                               <apex:outputText value="{!a.Start_Date__c}"/>
                         </apex:column>
                        <apex:column headerValue="End Date">
                               <apex:outputText value="{!a.End_Date__c}"/>
                         </apex:column>
                    </apex:pageblocktable>
            </apex:column>
        </apex:pageblocktable>
    </apex:pageBlock>
</apex:page>

 

You just had to apply it to the column not the text.

 

Cheers