I am trying to perform multiple grouping in my data tables, I can manage to group by one column thanks to this example.
https://datatables.net/examples/advanced_init/row_grouping.html
Does anybody know about any plugin that works with angular and angularDatables (https://l-lin.github.io/angular-datatables/#/welcome) to group the data by more than one column?
Thanks in advance.
In case of anybody was having the same problem, the only thing I did to the code provided in https://datatables.net/examples/advanced_init/row_grouping.html, was to use the same code for every column I wanted to group.
api.column(0 { page: 'current' })
.data()
.each(function(group, i) {
if (last !== group) {
$(rows)
.eq(i)
.before(
'<tr class="group"><td colspan="5">' + group + '</td></tr>'
);
last = group;
}
});
api.column(1 { page: 'current' })
.data()
.each(function(group, i) {
if (last !== group) {
$(rows)
.eq(i)
.before(
'<tr class="group"><td colspan="5">' + group + '</td></tr>'
);
last = group;
}
});
Based on @Martha's answer, it works also for angular 5 in this way:
var groupColumn = 1;
this.dtOptions = {
// pagingType: 'full_numbers',
pageLength: 10,
responsive: true,
language: { search: "" },
order:[1,'desc'],
columnDefs: [
{ type: 'date-uk', targets: 1} // specifying date format
],
drawCallback: function ( settings ) {
var api = this.api();
var rows = api.rows( {page:'current'} ).nodes();
var last=null;
api.column(groupColumn, {page:'current'} ).data().each( function ( group, i ) {
if ( last !== group ) {
$(rows).eq( i ).before(
'<tr style="background-color:#dedede" class="group"><th colspan="5">'+group+'</th></tr>'
);
last = group;
}
});
}
};
