How do i Expand and Collapse child rows using rowGroup extension ?

Swaroop

i'm able to solve this using drawCallback method - here is the code

"drawCallback": function (settings) {
var api = this.api();
var rows = api.rows({ page: 'current' }).nodes();
var last = null;
var groupadmin = [];
api.column(1, { page: 'current' }).data().each(function (group, i) {
if (last !== group) {
$(rows).eq(i).before(
'<tr style="cursor:pointer" class="group bg-info" id="' + i + '"><td colspan="5"><b>' + group + '</b></td></tr>'
);
groupadmin.push(i);
last = group;
}
});
for (var k = 0; k < groupadmin.length; k++) {
$("#" + groupadmin[k]).nextUntil("#" + groupadmin[k + 1]).addClass(' group_' + groupadmin[k]);
$("#" + groupadmin[k]).click(function () {
var gid = $(this).attr("id");
$(".group_" + gid).slideToggle(100);
});
}
},

so how can i do this using rowGroup extension - here is my code

rowGroup: {
startRender: function (rows, group) { return group + ' [ ' + rows.count() + ' ] ' },
dataSrc: 'employeeCity'
}