How to group rows in htmldatatable?

Question

How to group rows in htmldatatable? I am using JSF.

A short example :

TransNum   TransAmount   InvoiceNum   InvoiceAmount

   1                50          1              10  
   1                50          2              15
   1                50          3              30
   2                10          1               6
   2                10          2               5

If I select Grouping column as "InvoiceNum" then the table should look like:- (i.e Grouping is done on InvoiceNum):

TransNum   TransAmount   InvoiceNum   InvoiceAmount
                               1
  1                50          1              10         
  2                10          1               6
                               2
  1                50          2              15
  2                10          2               5
                               3
  1                50          3              30

TransNum TransAmount InvoiceNum InvoiceAmount Similarly, grouping can be done based on multiple columns values too.

Thanks in advance.

Answer 1

JSF h:dataTable has no built-in grouping.

Either you find a component that fits your needs in one of the component libraries, such as Primefaces, Richfaces or Icefaces.

Or you have to implement it yourself in the backing bean by sorting the list in the way you want.