Reordering with grouping

sonam

i want to implement row reordering and grouping of datatable together.but it is not woking.I made a dropdown ,we select an option from dropdown to get the column on the basis of which we group the data in data table but when we performing reordering and again select other option from dropdown,
the data is shuffing in the columns and facing same issue on maintaining the state of grouping.
please help me

sonam

dt = $('#tblallActiveCasesResults').dataTable({
"fnDrawCallback": function (oSettings) {

if (oSettings.aiDisplay.length == 0 ) {
return;
}

var nTrs = $('#tblallActiveCasesResults tbody tr');
var iColspan = nTrs[0].getElementsByTagName('td').length;
var sLastGroup = "";
for (var i = 0; i < nTrs.length; i++) {
var iDisplayIndex = oSettings._iDisplayStart + i;
var sGroup = oSettings.aoData[oSettings.aiDisplay[iDisplayIndex]]._aData[gpIndex];
if (sGroup != sLastGroup) {
var nGroup = document.createElement('tr');
var nCell = document.createElement('td');
nCell.colSpan = iColspan;
nCell.className = "group";
nCell.innerHTML = sGroup;
nGroup.appendChild(nCell);
nTrs[i].parentNode.insertBefore(nGroup, nTrs[i]);
sLastGroup = sGroup;
}
}
},
"aoColumnDefs": [
{ "bVisible": false, "aTargets": [gpIndex] }
],

"aaSortingFixed": [[gpIndex, 'asc']],
"sDom": 'Rlfrtip',
"sPaginationType": "bootstrap",
"bRetrieve": true
});


Here gpIndex is index of selected option from dropdown.Reordering is not working.