Apex Code Development You need to sign in to do that
Don't have an account?
sp13 changing table cell color
i created this table in my visualforce page with this code:
i need the table cell color to be red if the reservation with a seat number is taken and color yellow if pending.
for example, if seat number 1 is taken i want the table cell background color with the value of '1' to be red or yellow if it's pending.
help.
<table width="500" border="1">
<tr height="30">
<td width="10%"></td> <td width="5%"> PWD </td> <td width="5%"> 1 </td> <td width="5%"> 5 </td> <td width="5%"> 9 </td>
<td width="5%"> 13 </td> <td width="5%"> 17 </td> <td width="5%"> 21 </td> <td width="5%"> 25 </td> <td width="5%"> 29 </td>
<td width="5%"> 33 </td> <td width="5%"> 37 </td> <td width="5%"> 41 </td> <td width="5%"> 45 </td>
<td width="5%"> 49 </td> <td width="5%"> 53 </td> <td width="5%"> 57 </td> <td width="5%"> 61 </td>
</tr>
<tr height="30">
<td width="10%"></td><td width="5%"> PWD </td> <td width="5%"> 2 </td> <td width="5%"> 6 </td>
<td width="5%"> 10 </td> <td width="5%"> 14 </td> <td width="5%"> 18 </td> <td width="5%"> 22 </td>
<td width="5%"> 26 </td> <td width="5%"> 30 </td> <td width="5%"> 34 </td> <td width="5%"> 38 </td>
<td width="5%"> 42 </td> <td width="5%"> 46 </td> <td width="5%"> 50 </td> <td width="5%"> 54 </td>
<td width="5%"> 58 </td> <td width="5%"> 62 </td>
</tr>
<tr height="30">
<td colspan="17"></td> <td width="5%"> 63 </td>
</tr>
<tr height="30">
<td width="10%"></td> <td width="5%"> Driver's Seat </td> <td width="5%"> 3 </td> <td width="5%"> 7 </td>
<td width="5%"> 11 </td> <td width="5%"> 15 </td> <td width="5%"> 19 </td> <td width="5%"> 23 </td>
<td width="5%"> 27 </td> <td width="5%"> 31 </td> <td width="5%"> 35 </td> <td width="5%"> 39 </td>
<td width="5%"> 43 </td> <td width="5%"> 47 </td> <td width="5%"> 51 </td> <td width="5%"> 55 </td>
<td width="5%"> 59 </td> <td width="5%"> 64 </td>
</tr>
<tr height="30">
<td width="10%"></td> <td width="5%"> Driver's Seat </td> <td width="5%"> 4 </td> <td width="5%"> 8 </td>
<td width="5%"> 12 </td> <td width="5%"> 16 </td> <td width="5%"> 20 </td> <td width="5%"> 24 </td>
<td width="5%"> 28 </td> <td width="5%"> 32 </td> <td width="5%"> 36 </td> <td width="5%"> 40 </td>
<td width="5%"> 44 </td> <td width="5%"> 48 </td> <td width="5%"> 52 </td> <td width="5%"> 56 </td>
<td width="5%"> 60 </td> <td width="5%"> 65 </td>
</tr>
</table>
CLASS:
<tr height="30">
<td width="10%"></td> <td width="5%"> PWD </td> <td width="5%"> 1 </td> <td width="5%"> 5 </td> <td width="5%"> 9 </td>
<td width="5%"> 13 </td> <td width="5%"> 17 </td> <td width="5%"> 21 </td> <td width="5%"> 25 </td> <td width="5%"> 29 </td>
<td width="5%"> 33 </td> <td width="5%"> 37 </td> <td width="5%"> 41 </td> <td width="5%"> 45 </td>
<td width="5%"> 49 </td> <td width="5%"> 53 </td> <td width="5%"> 57 </td> <td width="5%"> 61 </td>
</tr>
<tr height="30">
<td width="10%"></td><td width="5%"> PWD </td> <td width="5%"> 2 </td> <td width="5%"> 6 </td>
<td width="5%"> 10 </td> <td width="5%"> 14 </td> <td width="5%"> 18 </td> <td width="5%"> 22 </td>
<td width="5%"> 26 </td> <td width="5%"> 30 </td> <td width="5%"> 34 </td> <td width="5%"> 38 </td>
<td width="5%"> 42 </td> <td width="5%"> 46 </td> <td width="5%"> 50 </td> <td width="5%"> 54 </td>
<td width="5%"> 58 </td> <td width="5%"> 62 </td>
</tr>
<tr height="30">
<td colspan="17"></td> <td width="5%"> 63 </td>
</tr>
<tr height="30">
<td width="10%"></td> <td width="5%"> Driver's Seat </td> <td width="5%"> 3 </td> <td width="5%"> 7 </td>
<td width="5%"> 11 </td> <td width="5%"> 15 </td> <td width="5%"> 19 </td> <td width="5%"> 23 </td>
<td width="5%"> 27 </td> <td width="5%"> 31 </td> <td width="5%"> 35 </td> <td width="5%"> 39 </td>
<td width="5%"> 43 </td> <td width="5%"> 47 </td> <td width="5%"> 51 </td> <td width="5%"> 55 </td>
<td width="5%"> 59 </td> <td width="5%"> 64 </td>
</tr>
<tr height="30">
<td width="10%"></td> <td width="5%"> Driver's Seat </td> <td width="5%"> 4 </td> <td width="5%"> 8 </td>
<td width="5%"> 12 </td> <td width="5%"> 16 </td> <td width="5%"> 20 </td> <td width="5%"> 24 </td>
<td width="5%"> 28 </td> <td width="5%"> 32 </td> <td width="5%"> 36 </td> <td width="5%"> 40 </td>
<td width="5%"> 44 </td> <td width="5%"> 48 </td> <td width="5%"> 52 </td> <td width="5%"> 56 </td>
<td width="5%"> 60 </td> <td width="5%"> 65 </td>
</tr>
</table>
public List<Seat__c> seat {get;set;}
//controller//
seat = [SELECT Id, Name FROM Seat__c WHERE (Taken__c=true and Pending__c=true) and Schedule__c = 'a0590000007O6Lu']
//controller//
seat = [SELECT Id, Name FROM Seat__c WHERE (Taken__c=true and Pending__c=true) and Schedule__c = 'a0590000007O6Lu']
i need the table cell color to be red if the reservation with a seat number is taken and color yellow if pending.
for example, if seat number 1 is taken i want the table cell background color with the value of '1' to be red or yellow if it's pending.
help.
What colors are being displayed with the code now ?
Did you try checking the debug logs to see if there are any errors?
See the below links,
http://mindfiresfdcprofessionals.wordpress.com/2013/09/30/salesforce-ui-styles-with-a-custom-html-table/
http://salesforce-walker.blogspot.in/2011/12/making-color-for-each-cell-in.html
http://stackoverflow.com/questions/19861124/conditionally-change-color-apex-visualforce
Regards,
Ashish
i'm using <table> (html), i tried doing this:
<apex:variable value="{!res}" var="r">
<td width="5%">
<div style="background-color:{!If(r.name=='6','#FF0000','')};">
6
</div>
</td>
</apex:variable>
but it shows this error: Unknown property 'VisualforceArrayList.name'
Error is in expression '{!If(r.name=='6','#FF0000','')}' in component <apex:variable> in page
i just need to compare the value in "res" to 6 and change the table cell color to red if the List "res" has the value "6".
Hi,
Looks like a syntax error,
<apex:variable var="c" value="{!contact}" />
Try this one,
<apex:variable var="r" value="{!res}" >
Or,
<div style="background-color:{! If(r.name=='6','Red','Green') } >
Also see the below link,
http://salesforce.stackexchange.com/questions/12483/render-vars-in-columns
Regards,
Ashish