display top 10 dynamic records in two column(Each 5 records)

Question

I'm using primefaces 5.2 and jsf. I'm using data-table for displaying top ten failed TC's and those count. Records are dynamic values and fetching from DB, its working fine. But i want display the 10 records in two columns of each 5 records. For Example : TC NAME COUNT TC01_Test 35 TC06_Test 15 TC02_Test 23 TC07_Test 13 TC03_Test 20 TC08_Test 10 TC04_Test 18 TC08_Test 9 TC05_Test 17 TC10_Test 5

I want display my records like above mentioned example. How can i achieve this? XHTML:

<div class="DTHeadertwo" >
                        <p:dataTable var="failedTCs" value="#{reportsExeProgressBean.topTenFailedTcs}" >
                            <p:column headerText="TC Name">        
                                <h:outputText style="font-size: 12px;" value="#{failedTCs.testCaseName}" />    
                            </p:column>
                            <p:column headerText="Failed Count">        
                                <h:outputText style="font-size: 20px;" value="#{failedTCs.failedCount}" />    
                            </p:column>
                        </p:dataTable>
                        </div>

Answer 1

you can not use DataTable in that way

better consider using dataGrid but even with that your list become like this:

TC01_Test     35      TC02_Test     15
TC03_Test     23      TC04_Test     13
TC05_Test     20      TC06_Test     10
TC07_Test     18      TC08_Test     9
TC09_Test     17      TC10_Test     5

code example:

<p:dataGrid var="failedTCs" value="#{reportsExeProgressBean.topTenFailedTcs}" columns="2" layout="grid"
    rows="10" >
    <p:panel style="text-align:center">
        <h:panelGrid columns="2" style="width:100%">
           <h:outputText style="font-size: 12px;" value="#{failedTCs.testCaseName}" />
        <h:outputText style="font-size: 20px;" value="#{failedTCs.failedCount}" />
        </h:panelGrid>
    </p:panel>
</p:dataGrid>