rich:scrollableDataTable style classes problem
Good afternoon.
I use scrollableDataTable and wanted to set up five different classes for it: one for header, one for columns and three for rows(active, selected and ordinary). As I've understood, all classes set by user are merged with RF default classes for this kind of table.
Well, the code is:
...
<h:form id="relativesTab_dataTableForm">
<rich:scrollableDataTable height="200px" rowKeyVar="rkv" frozenColCount="1" activeClass="sdt_row_active"
selectedClass="sdt_row_selected" rowClasses="sdt_row1,sdt_row2" columnClasses="sdt_col"
width="470px" id="staffDataTable" rows="#{amBean.employeeListMan.listSize}"
value="#{amBean.employeeListMan.employees}" var="employee" sortMode="single">
<rich:column id="firstName">
<f:facet name="header"><h:outputText styleClass="sdt_head" value="First Name" /></f:facet>
<h:outputText value="#{employee.firstName}" />
</rich:column>
<rich:column id="lastName">
<f:facet name="header"><h:outputText styleClass="sdt_head" value="Last Name" /></f:facet>
<h:outputText value="#{employee.lastName}" />
</rich:column>
<rich:column id="sex">
<f:facet name="header"><h:outputText styleClass="sdt_head" value="Sex" /></f:facet>
<h:outputText value="#{employee.sex}" />
</rich:column>
<rich:column id="birthDate">
<f:facet name="header"><h:outputText styleClass="sdt_head" value="Birth Date" /></f:facet>
<h:outputText value="#{employee.birthDate}" />
</rich:column>
<rich:column id="birthPlace">
<f:facet name="header"><h:outputText styleClass="sdt_head" value="Birth Place" /></f:facet>
<h:outputText value="#{employee.birthPlace}" />
</rich:column>
</rich:scrollableDataTable>
</h:form>
...and styles for that are:
.sdt_col
{
font-family: Tahoma;
font-size: 11px;
color: #000000;
text-decoration: none;
font-weight: bold;
text-align: center;
vertical-align: middle;
padding-left: 5px;
padding-right: 5px;
}
.sdt_row_active
{
background-color: #FF0000;
color: #4e6fbc;
}
.sdt_row_selected
{
background-color: #0000FF;
color: #000000;
}
.sdt_row1
{
background-color: #FFFFFF;
}
.sdt_row2
{
background-color: #AAAAAA;
}
.sdt_head
{
padding : 4px 4px 4px 4px;
border-right : 1px solid #c0c0c0;
border-bottom : 1px solid #c0c0c0;
font-family: Tahoma;
font-size: 11px;
font-weight: bold;
color: #000000;
text-align : center;
text-decoration: none;
text-align: center;
}So if I use the code pasted above - the colors are constant - odd rows are with white background and even rows are with gray background. If I click on a row - colors are NOT changing. When I just remove rowClasses attribute - the selectedClass attribute works well, but activeClass still doesn't. And when I remove both of rowClasses and selectedClass, leaving only activeClass - it starts working normally.
Why does it happens? Can't I use a combination of these three attributes? Or it's a bug?
