Wednesday, April 25, 2012

Conditional Coloring of Datatable in PF or var vs binding tags in a datatable

I have a datatable and a collector. Each row in the datatable has a button and this button adds the corresponding row to the collector. I want to add conditional coloring to this datatable. Condition is whether the selected rows are in the collector or not.



<p:dataTable rowStyleClass="#{backingBean.selectedMemberList.contains(aMember) ? 'passive' : 'active'}" style="width: 100%;" id="dTable" var="aMember" value="#{backingBean.memberList}">
<p:column>
...
</p:column>

<p:column>
<p:commandButton id="btn_add" value="Add" update=":mf:op" process=":mf:op_uk">
<p:collector value="#{aMember}" addTo="#{backingBean.selectedMemberList}" />
</p:commandButton>
</p:column>


backing bean:



List<Member> selectedMemberList;
List<Member> memberList;

//getter and setter methods


Above code does passive style class but does not add active style. I thought it is maybe because I can not pass var (which is request scoped) to backing bean.. So I tried binding the value to a backing bean value:



<p:dataTable binding="#{backingBean.anotherMember}" rowStyleClass="#{backingBean.selectedMemberList.contains(aMember) ? 'passive' : 'active'}" style="width: 100%;" id="dTable" var="aMember" value="#{backingBean.memberList}">


backingBean:



private Member anotherMember;
//getter and setter methods


but it did not work either. Does anyone have any recommendation about this issue?



PrimeFaces ver 2.2.1



EDIT:
css contains these fields:



.active{    
background-image: none !important;
}

.passive{
background-color:gainsboro !important;
background-image: none !important;
}




No comments:

Post a Comment