rowGroup expand collapse all row group with button
rowGroup expand collapse all row group with button

I have a table the uses the rowGoup extension with startRender function that expands and collapses the row groups.
By default all groups are collapsed. All this works great.
Now I am trying to code a function for 2 buttons that would "expand all" and "collapse all"
I am having a difficult time trying to figure this out.
Has anyone did this before? Of has an idea how to do this?
Below is the code from rowGroup function.
rowGroup: {
dataSrc: [ 'employee_full_name', 'out_of_office'],
startRender: function (rows, group, level) {
var all;
if (level === 0) {
level_1 = group;
all = group;
level_2 ='';
} else {
// if parent collapsed, nothing to do
if (!!collapsedGroups[level-1]) {
return;
}
if (level === 1) {
level_2 = group
}
all = level_1 + level_2 + group;
}
console.log(group, level, all)
var collapsed = !!collapsedGroups[all];
rows.nodes().each(function (r) {
r.style.display = 'none';
if (collapsed) {
r.style.display = '';
}});
//fontawsome + and -
var toggleClass = collapsed ? 'fa fa-minus-circle' : 'fa fa-plus-circle';
var groupTD = '';
if(level == 0){
groupTD = '<td colspan="' + rows.columns()[0].length +'">' + group + ' (' + rows.count() + ')</td>'
}else{
groupTD = '<td colspan="' + rows.columns()[0].length +'">' + '<span style="color:#007bff;" class="fa fa-fw ' + toggleClass + ' toggler"/> ' + group + ' (' + rows.count() + ')</td>'
}
// Add category name to the <tr>
return $('<tr/>')
.append(groupTD)
.attr('data-name', all)
.toggleClass('collapsed', collapsed);
}
}
This question has an accepted answers - jump to answer
Answers
You are tracking the collapsed groups in the global variable
collapsedGroups
. One option is to manipulate that object variable in your "expand all" and "collapse all" event handlers to show or hide the grouped rows.Another option is to use another global variable as a flag. The flag would have three values; 1 to process normally, 2 show all and 3 show none. Use that flag in
startRender
.You button event handlers will need to call
draw()
to redraw the rowGroups.Kevin
Thank you for the suggestions. I will work these options out.