function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Amber NeillAmber Neill 

Showing an image (via formula) in my page

I have a picklist field (color__c) that has 4 possible values (Super Green, Green, Yellow & Red).  I need to show those colors based on the value of the field.

Here's what I have code-wise: 

 

<h1>Color: {!Support_Scorecard__c.Color_Code__c} </h1>

 

Here's the formula behind color_code__c: 

 

 

IF(ISPICKVAL(color__c, "Super Green"), IMAGE("/servlet/servlet.FileDownload?file=015T00000003eay", "Super Green"), 
IF(ISPICKVAL(color__c, "Green"), IMAGE("/servlet/servlet.FileDownload?file=015T00000003eat", "Green"), 
IF(ISPICKVAL(color__c, "Yellow"), IMAGE("/servlet/servlet.FileDownload?file=015T00000003eao", "Yellow"), 
IF (ISPICKVAL(color__c, "Red"), IMAGE("/servlet/servlet.FileDownload?file=015T00000003eaj", "Red"), 
"No Color Specified"))))

 

 

That works just fine in the regular page layout, but doesn't work at all in Visualforce.  What am I missing?

Any help you can offer is much appreciated.

Thanks,

Amber

 

Best Answer chosen by Admin (Salesforce Developers) 
timainmantimainman

Sorry for the incorrect answer I was doing a couple things at once today. This should work for you. Use the <apex:outputText>  tag. It has a attribute "escape" if you set this to false your image should be rendered. Basically it is telling the VF page to not escape whatever is in the outputText.

 

Like this:

 

<apex:outputText escape="false" value="{!Support_Scorecard__c.Color_Code__c} " />

 

Let me know if that works.

All Answers

timainmantimainman

Quick question. What is being displayed on the VF page? What do you see after "Color:"? Url? blank?

 

Amber NeillAmber Neill

Here's what I get:

 

Color: <img src="/servlet/servlet.FileDownload?file=015T00000003eat" alt="Green" border="0"/>

 

So it displays the value of the formula field rather than rendering it as HTML...like it would in a regular page layout.

Thanks!
Amber

 

 

 

 

 

 


timainmantimainman

Try this:

 

 <apex:image value="{!Support_Scorecard__c.Color_Code__c}" />

Amber NeillAmber Neill

So close!  I have an image, but it is a broken image!

 

When I look at the resulting HTML I see the following where the image should be:

 

<img src="<img+src=%22/servlet/servlet.FileDownload?file=015T00000003eaj%22%20alt=%22Red%22%20border=%220%22/%3E" />

Clearly there are too many "img src"'s.  So, how do I modify my formula to only include the needed parts? For reference, here is my formula again:

 

 

IF(ISPICKVAL(color__c, "Super Green"), IMAGE("/servlet/servlet.FileDownload?file=015T00000003eay", "Super Green"), 
IF(ISPICKVAL(color__c, "Green"), IMAGE("/servlet/servlet.FileDownload?file=015T00000003eat", "Green"), 
IF(ISPICKVAL(color__c, "Yellow"), IMAGE("/servlet/servlet.FileDownload?file=015T00000003eao", "Yellow"), 
IF (ISPICKVAL(color__c, "Red"), IMAGE("/servlet/servlet.FileDownload?file=015T00000003eaj", "Red"), 
"No Color Specified"))))

 

IF(ISPICKVAL(color__c, "Super Green"), IMAGE("/servlet/servlet.FileDownload?file=015T00000003eay", "Super Green"), IF(ISPICKVAL(color__c, "Green"), IMAGE("/servlet/servlet.FileDownload?file=015T00000003eat", "Green"), IF(ISPICKVAL(color__c, "Yellow"), IMAGE("/servlet/servlet.FileDownload?file=015T00000003eao", "Yellow"), IF (ISPICKVAL(color__c, "Red"), IMAGE("/servlet/servlet.FileDownload?file=015T00000003eaj", "Red"), "No Color Specified"))))

 

I'm thinking I shouldn't use the IMAGE() formula here and instead let VF do it's thing....but how?

Thanks again for helping!  I really appreciate it!!!
Amber

timainmantimainman

Sorry for the incorrect answer I was doing a couple things at once today. This should work for you. Use the <apex:outputText>  tag. It has a attribute "escape" if you set this to false your image should be rendered. Basically it is telling the VF page to not escape whatever is in the outputText.

 

Like this:

 

<apex:outputText escape="false" value="{!Support_Scorecard__c.Color_Code__c} " />

 

Let me know if that works.

This was selected as the best answer
Amber NeillAmber Neill

Perfect!  That's exactly what I needed!

You da man!

Thanks again!!!
Amber