JBoss.orgCommunity Documentation
The component combines columns in one row to organize complex subparts of a table.
Completely skinned table columns and child elements
Possibility to combine columns and rows inside
Possibility to update a limited set of strings with Ajax
The <rich:columnGroup> component combines columns set wrapping them into the <tr> element and outputting them into one row. Columns are combined in a group the same way as when the "breakBefore" attribute is used for columns to add a moving to the next rows, but the first variant is clearer from a source code. Hence, the following simple examples are very same.
Example:
...
<rich:dataTable value="#{capitalsBean.capitals}" var="cap" rows="5" id="sublist">
<rich:column colspan="3">
<f:facet name="header">State Flag</f:facet>
<h:graphicImage value="#{cap.stateFlag}"/>
</rich:column>
<rich:columnGroup>
<rich:column>
<h:outputText value="#{cap.state}"/>
</rich:column>
<rich:column >
<h:outputText value="#{cap.name}"/>
</rich:column>
<rich:column >
<h:outputText value="#{cap.timeZone}"/>
</rich:column>
</rich:columnGroup>
</rich:dataTable>
...
And here is a representation without a grouping:
Example:
...
<rich:dataTable value="#{capitalsBean.capitals}" var="cap" rows="5" id="sublist">
<rich:column colspan="3">
<f:facet name="header">State Flag</f:facet>
<h:graphicImage value="#{cap.stateFlag}"/>
</rich:column>
<rich:column breakBefore="true">
<h:outputText value="#{cap.state}"/>
</rich:column>
<rich:column>
<h:outputText value="#{cap.name}"/>
</rich:column>
<rich:column>
<h:outputText value="#{cap.timeZone}"/>
</rich:column>
</rich:dataTable>
....
The result is:
It's also possible to use the component for output of complex headers in a table. For example, adding of a complex header to a facet for the whole table looks the following way:
Example:
...
<rich:dataTable value="#{capitalsBean.capitals}" var="cap" rows="5" id="sublist">
<f:facet name="header">
<rich:columnGroup>
<rich:column rowspan="2">
<h:outputText value="State Flag"/>
</rich:column>
<rich:column colspan="3">
<h:outputText value="State Info"/>
</rich:column>
<rich:column breakBefore="true">
<h:outputText value="State Name"/>
</rich:column>
<rich:column>
<h:outputText value="State Capital"/>
</rich:column>
<rich:column>
<h:outputText value="Time Zone"/>
</rich:column>
</rich:columnGroup>
</f:facet>
<rich:column>
<h:graphicImage value="#{cap.stateFlag}"/>
</rich:column>
<rich:column>
<h:outputText value="#{cap.state}"/>
</rich:column>
<rich:column>
<h:outputText value="#{cap.name}"/>
</rich:column>
<rich:column>
<h:outputText value="#{cap.timeZone}"/>
</rich:column>
</rich:dataTable>
...
The generated table on a page looks as follows:
Table of <rich:columnGroup> attributes.
Table 6.32. Component Identification Parameters
Name | Value |
---|---|
component-type | org.richfaces.ColumnGroup |
component-class | org.richfaces.component.html.HtmlColumnGroup |
component-family | org.richfaces.ColumnGroup |
renderer-type | org.richfaces.ColumnGroupRenderer |
tag-class | org.richfaces.taglib.ColumnGroupTag |
Custom style classes as well as skin parameters for <rich:columnGroup> are the same as for the <rich:dataTable> component.
You can find all necessary information about style classes redefinition in Definition of Custom Style Classes section.
On the component LiveDemo page you can find the example of the <rich:columnGroup> usage and sources as well.