Sign Up ›

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

Visualforce conditional styling using CASE function

Hi,

I'm trying to change the background colour of a DIV on a VF page based on the value of a field. Since I have multiple options, it seems the best way to do this is to use the CASE function. However, I can't seem to get it to work. 

I have the follwing code: 
<div class="programstatus" style="background-color:{!CASE(program.Program_Status__c == 'Applications Open', '#67AC34', program.Program_Status__c == 'Applications Closed' , '#F12923' )}">
                <apex:outputText value="{!program.Program_Status__c}"></apex:outputText>
                </div>

However, when I try to save, I get the following error: Error: Incorrect argument type for function 'CASE()'.

Any idea I'm doing wrong?
Thanks
Best Answer chosen by Benzy
Ashish_Sharma_DEVSFDCAshish_Sharma_DEVSFDC
Hi Benzy,

Please try below code. 
<div class="programstatus" style="background-color:{!CASE(program.Program_Status__c,'Applications Open', '#67AC34', program.Program_Status__c,'Applications Closed' , '#F12923' )}">
	<apex:outputText value="{!program.Program_Status__c}"></apex:outputText>
</div>

Mark this as BEST ANSWER if it helps you.

All Answers

Ashish_Sharma_DEVSFDCAshish_Sharma_DEVSFDC
Hi Benzy,

Please try below code. 
<div class="programstatus" style="background-color:{!CASE(program.Program_Status__c,'Applications Open', '#67AC34', program.Program_Status__c,'Applications Closed' , '#F12923' )}">
	<apex:outputText value="{!program.Program_Status__c}"></apex:outputText>
</div>

Mark this as BEST ANSWER if it helps you.
This was selected as the best answer
Madhanprabhu Thangadurai 1Madhanprabhu Thangadurai 1
Hi Benzy,

Try this and include "default color" code also if Program_Status__c is a picklist field. 
<div class="programstatus" style="background-color:{!CASE(program.Program_Status__c, 'Applications Open', '#67AC34','Applications Closed' , '#F12923','default color')}">
	<apex:outputText value="{!program.Program_Status__c}"></apex:outputText>
</div>
BenzyBenzy
That worked.
Thank you both!