Change backgroud color to rowExpansion of dataTable

[teri-chan]

Alright, my bad.

My datatable is backed by an array list of critems. (i snipped non-essential attributes)

Code: Select all

<p:dataTable id="critemsGrid" var="critem" value="#{reunionHandler.reunionCritems}"
                                     rowStyleClass="#{critem.type}"> 
<p:column >
...
</p:column>

<p:rowExpansion id="critemExpansion" styleClass="#{critem.type}" >
 </p:rowExpansion>
</p:dataTable> 

Datatable rows are style just fine, but all rows corresponding to the rowExpansion have the same style as the first one.
Example of generated code:

Code: Select all

<tr class="ui-widget-content ui-datatable-even DECISION ui-expanded-row" role="row" data-ri="0">
<tr class="ui-expanded-row-content ui-widget-content DECISION" style="">
<tr class="ui-widget-content ui-datatable-odd TASK ui-expanded-row" role="row" data-ri="1">
<tr class="ui-expanded-row-content ui-widget-content DECISION" style="">

As you can see, on the second expanded row, the style is DECISION (like the first one) even if the associated row has the good style (TASK)

[kukeltje]

what if you remove the id attribute?

[teri-chan]

I doesn't change anything. I tried to use rowIndexVar too, but at no end...

Code: Select all

<p:dataTable rowIndexVar="row">

...

<p:rowExpansion styleClass="#{row}" >

In every row generated, i have a class set at "-1".

The thing thag confuses me the most is that in my rowExpansion content i use the critem and it works perfectly.

[kukeltje]

Hmmmm... Can you check what happens if you call a getter on a different bean and do e.g. a ++ on a value and return and log that to see if te bean is actually called multiple times? There were some major changes in the datatable for 3.5, maybe the rowexpansion 'renderer' part is cashed now.

[teri-chan]

I tried to use a simple getter, which increments a value.

Code: Select all

 <p:rowExpansion styleClass="#{reunionHandler.testExpansion}" >

public int getTestExpansion() {
        testExpansion++;
        LOGGER.debug("getTestExpansion: " + testExpansion);
        return testExpansion;
    }

Everytime i expand a row, the getter is called two times, so result is as following:

Code: Select all

<tr class="ui-widget-content ui-datatable-even INFORMATION ui-expanded-row" role="row" data-ri="0">
<tr class="ui-expanded-row-content ui-widget-content 2" style="">
<tr class="ui-widget-content ui-datatable-odd DECISION ui-expanded-row" role="row" data-ri="1">
<tr class="ui-expanded-row-content ui-widget-content 4" style="">
<tr class="ui-widget-content ui-datatable-even TASK ui-expanded-row" role="row" data-ri="2">
<tr class="ui-expanded-row-content ui-widget-content 6" style="">

So it seems the style is really evaluated multiple times, it's only when it uses datatable source that it doesn't work as expected.

[MTornros]

This should be doable just by using css. For example:

Code: Select all

.INFORMATION+.ui-expanded-row-content {
    background-color:red;
}
.DECISION+.ui-expanded-row-content {
    background-color:yellow;
}

The '+' selector means straight after, so ".INFORMATION+.ui-expanded-row-content" will select any element with the class ui-expanded-row-content directly following an element with the class INFORMATION. You can of course tailor this to be much more specific if you want. I'm guessing that the usage intended by primefaces developers is that if you set a styleClass on the rowExpansion element, you can use this class instead of .ui-expanded-row-content to select it.

[kukeltje]

Very good suggestion... Never thought of that...

[teri-chan]

Thanks, it is indeed a very good suggestion!
In the meantime we applied the class to an outputpanel inside the rowExpansion (as suggested higher) but we will try this more elegant css solution.

[krishnabang]

[Hi,
I am new to JSF and trying to use the row expansion code on primefaces.org, but i am not able to do the same,
I see that you have created some patch , using which we cab use the same, please help me as to how to use this patch and how to run my application so as to run my row expansion thing.