You need to sign in to do that
Don't have an account?
Conditional formatting - querying different rows within a table
I'm kind of a newbie, so please excuse if this is simplistic - but I can't find anything on it. Here goes:
WIthin Visualforce, is it possible to look at a cell in ANOTHER row and format the current cell based on it what it finds?
In Excel's conditional formatting it would be something like =IF(A2 <> A1, black, grey)
All I want is to change the style of a cell if the one above it is the same, giving me:
Type SKU
Switch | 17982 |
Switch | 17983 |
Switch | 17985 |
Button | 17988 |
Button | 17989 |
Knob | 19827 |
Knob | 19829 |
While something like this could be achieved within the controller, I'm trying to make it work on a Visualforce page so that if dynamic filters within the page are applied, the page formatting adjusts without having to do another query.
I did find another post which does something similar within the same row, (Re: conditional styling in table), but there's no mention of how this type of referential access might be achieved within a table.
Has anyone done something similar? If so, how did you manage? Any help is most appreciated.
Hi
You can do this by just 2 different CSS classes like
<tr class={!IF(a1>a2,'blackBg','whiteBg')}>
in above you just need 2 css classes named blackBg and whiteBg also a1 and a2 are 2 numbers
All Answers
If you want to do dynamic formatting based on the values displayed in the UI without querying the controller, then your best bet is using a javascript library like jQuery which allows you to manipulate the DOM (document object model) to your hearts content.
jQuery lets you style, change, and animate certain aspects of your html document based on certain user actions, or changes in the value.
Hope this helps!
- Anup
Hi
You can do this by just 2 different CSS classes like
<tr class={!IF(a1>a2,'blackBg','whiteBg')}>
in above you just need 2 css classes named blackBg and whiteBg also a1 and a2 are 2 numbers
Hi,
Try the below code snippet as reference:
-------- vf page------------
<apex:page controller="csstest_styleon_pageBlckTble_wthCodtion" tabStyle="Opportunity">
<apex:form >
<apex:sectionHeader title="Opps List" />
<apex:pageBlock title="" id="pageBlock">
<apex:pageMessages ></apex:pageMessages>
<apex:pageBlockTable value="{!opportunities}" var="o" rendered="{!NOT(ISNULL(opportunities))}">
<apex:column value="{!o.Name}"></apex:column>
<apex:column value="{!o.Account.Name}"></apex:column>
<apex:column value="{!o.Amount}"></apex:column>
<apex:column >
<apex:facet name="header">Status</apex:facet>
<div style="background-color:{!IF(o.CloseDate > TODAY(),'#7CFC00', '#FFA07A')}">
{!IF(o.CloseDate > TODAY(),'Open', 'Closed')}
</div>
</apex:column>
<apex:column style="{!IF(o.StageName=='Closed Lost','background:lightgreen',IF(o.StageName=='Closed Won','background:red','background:yellow'))}" >{!o.StageName}</apex:column>
<apex:column style="{!IF(o.StageName=='Closed Lost','background:lightgreen',IF(o.StageName=='Closed Won','background:red','background:yellow'))}" >{!o.Name}</apex:column>
</apex:pageBlockTable>
</apex:pageBlock>
</apex:form>
</apex:page>
----- apex controller----------------
public class csstest_styleon_pageBlckTble_wthCodtion {
private List<Opportunity> opportunities;
public List<Opportunity> getOpportunities()
{
opportunities = [Select Name, Amount, Account.Name, CloseDate,StageName from Opportunity];
return opportunities;
}
}
Did this answer your question? If not, let me know what didn't work, or if so, please mark it solved.
While we can have two different styles based on an IF statement, this doesn't address the problem of looking up to or querying the previous row. That's where I'm stuck.
How do I look at the previous row in an IF statement strictly within Visualforce?
In Excel, using "A2<>A1" would automatically change to "A3<>A2";"A4<>A3", etc., row after row unless you used "$A$2 <> $A$1"
When using row or the repeat function within visualforce we need the code to compare THIS ROW with PREVIOUS ROW - and that I'm beginning to think is not possible.
Unless you can do something like:
AND have the bracketed number automatically increment with each repeated row? ...or is there a way to dynamically address rows?
I don't know. Just grasping at straws here...maybe Javascript is the only way?
Lexlex
You need to create a wrapper class and pageblocktable for your table list that looks something