I have a table that makes use of row.child where each row is expandable/collapse-able, but my parent rows can and will have duplicate data. Is it possible to rowGroup
the multiple duplicate parent rows and still maintain the expandable/collapse-able functionality from row().child
?
The following is what I've tried, but it doesn't provide the expected results:
function loadDataTable(data) {
var table = $('#List').DataTable({
"data": data,
"columns": [
{
"className": 'details-control',
"orderable": false,
"defaultContent": ''
},
{ "data": "SomeVal1" },
{ "data": "SomeVal2" },
{ "data": "SomeVal3" },
{ "data": "SomeVal4" },
{ "data": "SomeVal5" },
{ "data": "SomeVal6" },
{ "data": "SomeVal7" }
],
"rowGroup": {
dataSrc: 'SomeVal1'
},
"order": [[1, 'asc']]
});
$('#List tbody').on('click', 'td.details-control', function () {
var tr = $(this).closest('tr');
var row = table.row(tr);
if (row.child.isShown()) {
// This row is already open - close it
row.child.hide();
tr.removeClass('shown');
}
else {
// Open this row
row.child(format(row.data())).show();
tr.addClass('shown');
}
});
};