Group 1 | Group 2 | Group 3 | ||||||
---|---|---|---|---|---|---|---|---|
ID | Date 1 | Dates 2, 3, 4 | Date 5 | Note | Section | |||
2 | 03/01/2014 | 10/01/2016 | 01/01/2014 | 23/01/2014 | 18/01/2014 | 000-003 | INT | |
3 | 03/01/2015 | 10/01/2015 | 02/01/2014 | 24/01/2014 | 18/01/2015 | 000-001 | INT | |
1 | 03/01/2016 | 10/01/2014 | 03/01/2014 | 22/01/2014 | 18/01/2016 | 000-002 | INT |
It is possible to have advanced table header setups where your column headers are grouped. The groupings will also be inside the detail rows.
<table class="table footable"> <thead> <tr class="footable-group-row"> <th data-group="group1" colspan="3">Group 1</th> <th data-group="group2" colspan="3">Group 2</th> <th data-group="group3" colspan="3">Group 3</th> </tr> <tr> <th data-group="group1" data-ignore="true"><input type="checkbox"/></th> <th data-group="group1">ID</th> <th data-group="group1" data-hide="phone,tablet">Date 1</th> <th data-group="group2" data-hide="phone" colspan="3" data-names="Date 2,Date 3,Date 4">Dates 2, 3, 4</th> <th data-group="group3" data-hide="phone">Date 5</th> <th data-group="group3" data-hide="phone,tablet">Note</th> <th data-group="group3" data-hide="phone,tablet">Section</th> </tr> </thead>