I'm quite new with JSF primefaces 3.1. I try to build a "complex" table and I cannot find a good solution using dataTable (I need a sorting component).
I would like to build a table equivalent to the following HTML representation, using a basic POJO like that:
String field1
String field2
List<String> fields3 // 3 items
String field4
<table border="1">
<tr>
<td rowspan="3">col1</td>
<td rowspan="3">col2</td>
<td>col3.1</td>
<td rowspan="3">col4</td>
</tr>
<tr>
<td>col3.2</td>
</tr>
<tr>
<td>col3.3</td>
</tr>
</table>
I give maybe too little information, so if you need it, please tell me :) I hope that my question is clear.
Thank you
A rock-solid and all flexible solution for custom grids is to use <c:forEach> together with Primefaces <p:panelGrid>:
<html ... xmlns:c="http://java.sun.com/jsp/jstl/core"
xmlns:p="http://primefaces.org/ui">
<p:panelGrid>
<p:row>
<p:column styleClass="ui-state-default" colspan="2"><!-- header -->
<h:outputText value="Some Header"/>
</p:column>
...
</p:row>
<p:row><!-- other header row -->
...
</p:row>
<c:forEach items="#{list}" var="element">
<p:row>
<p:column styleClass="ui-state-default" rowspan="#{list.sublist.someSizeExpression}"><!-- left rowspan -->
<h:outputText value="#{element.name}"/>
</p:column>
<c:forEach items="#{element.sublist}" var="subelement">
<p:column>
<h:selectBooleanCheckbox/>
</p:column>
</c:forEach>
</p:row>
</c:forEach>
</p:panelGrid>
</html>
It looks nice, Command-Buttons and AJAX works in both Head and Cells.
since you mentioned primefaces
in your tags.
I recommend you to use p:panelGrid
<p:panelGrid>
<p:row>
<p:column rowspan="3"/>
<p:column rowspan="3"/>
<p:column rowspan="1"/>
<p:column rowspan="3"/>
</p:row>
<p:row>
<p:column/>
</p:row>
<p:row>
<p:column/>
</p:row>
</p:panelGrid>
I had the same problem : primefaces (or richfaces) offers rowspan only for header and footer.
Then I tried to use the icefaces ace:datatable
component and it run by adding only one attribute in the colum(s) you want to be "rowspanable" : ace:column
: groupBy="#{bean.field}"
.
You give as usual a list of rows and this component generates all rowspan automatically (I think by autodetecting neigbourhood of equals values) in the generated html table.
It runs altogether with primefaces components : at this moment I have primefaces outputlabel in the icefaces datatable cells ant this icefaces datatable is inside a primefaces panel.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With