To create a data table in JSF in which the first row data spans across the columns ie only one column in the first row and the second row had 8 columns and it should alternate like that. This is not possible with h:dataTable tag
Reason:
The h:dataTable tag renderds data column wise
Solution:
To create such a table with column span use jstl along with plain html and jsf components
Sample Code:
<c:forEach items="#{HospInvProfBean.productList}" var="product" varStatus="status"> /> <tr><td colspan="8" class="genText">
<h:outputText value="#{product.productDescription}"/></td> </tr>
<tr class="dtlLineCen">
<td style="width: 10%;">
<span class="genText">Minimum</span></td>
<td><h:inputText size="4" value="#{product.oposMin}" converter="javax.faces.Long" converterMessage="Not a number"/></td>
<td><h:inputText size="4" value="#{product.aposMin}" converter="javax.faces.Long" converterMessage="Not a number" /></td>
<td><h:inputText size="4" value="#{product.bposMin}" required="true" /></td>
<td><h:inputText size="4" value="#{product.abposMin}" required="true" /></td>
<td><h:inputText size="4" rendered="#{product.aboGroup}" value="#{product.onegMin}" required="true" /></td>
<td><h:inputText size="4" rendered="#{product.aboGroup}" value="#{product.anegMin}" required="true" /></td>
<td><h:inputText size="4" rendered="#{product.aboGroup}" value="#{product.bnegMin}" required="true" /></td>
<td><h:inputText size="4" rendered="#{product.aboGroup}" value="#{product.abnegMin}" required="true" /></td></tr>
<tr class="dtlLineAltCen">
<td style="width: 10%;"><span class="genText">Optimal</span></td> <td><h:inputText size="4" value="#{product.oposOpt}" required="true" /></td>
<td><h:inputText size="4" value="#{product.aposOpt}" required="true" /></td>
<td><h:inputText size="4" value="#{product.bposOpt}" required="true" /></td>
<td><h:inputText size="4" value="#{product.abposOpt}" required="true" /></td>
<td><h:inputText size="4" rendered="#{product.aboGroup}" value="#{product.onegOpt}" required="true"/></td>
<td><h:inputText size="4" rendered="#{product.aboGroup}" value="#{product.anegOpt}" required="true"/></td>
<td><h:inputText size="4" rendered="#{product.aboGroup}" value="#{product.bnegOpt}" required="true"/></td>
<td><h:inputText size="4" rendered="#{product.aboGroup}" value="#{product.abnegOpt}" required="true"/></td>
</c:forEach>