jsf h:dataTable on 4 columns

Question

i have the following simple code:

it print out some labels but it shows only 2 columns

but in the panelGrid i have specified

  columns=4

i want 4 columns not 2.

the code:

        <p:tab title="Details Udfs" rendered="#{errorContractBean.flagMoneyD}">  
                    <h:panelGrid id="detailsudfM" columns="4" cellpadding="5" style="margin-bottom:5px" styleClass="grid">
                            <h:dataTable var="o" value="#{errorContractBean.liM}">
                            <h:column>
                                    <h:outputText value= "#{o.udf}"/>
                            </h:column>
                            <h:column>
                                    <h:outputText  value= "#{o.value}" style="font-weight:bold;"/>
                            </h:column>
                           </h:dataTable>                           
                    </h:panelGrid>
                </p:tab>  

current output:

desired output:

Answer 1

The panelGrid actually has 4 columns, but in the first row and the first column there is the datatable and the datatable has only 2 columns. I dont think that you should use a datatable here. Use the facelets c:forEach-tag instead. Try the following:

<h:panelGrid columns="4">
    <c:forEach var="o" items="#{errorContractBean.liM}">
        <h:outputText value= "#{o.udf}"/>
        <h:outputText value= "#{o.value}" style="font-weight:bold;"/>
    </c:forEach>
</h:panelGrid>