jQuery Datatables rowGroup Collapse/Expand

Question

I\'m using jQuery Datatables and I would like to incorporate row grouping into the table.

I have attempted to incorporate it myself by adding rows and a click event

Answer 1

I have found my own answer so I want to share it if anyone else has future problems with this.

Use the below code to implement row Grouping where index is the column index that you want to group by:

var dataSrc = g_oTable.columns(index).dataSrc();

g_oTable.order([index, "asc"]).draw();
g_oTable.order.fixed({
    pre: [ index, 'asc' ]
}).draw();

g_oTable.rowGroup().dataSrc(dataSrc[0]);
g_oTable.rowGroup().enable().draw();

$('.group').each(function(i, obj) {
    $(obj).nextUntil('tr.group').each(function(i) {
        $(this).toggle();
    });
});
g_oTable.draw();

Then add a click event handler to your row Groups:

$( document ).on("click", "tr.group", function(){
    $(this).nextUntil('tr.group').toggle();
});