Datatable stop working on using column show hide functionality

bssehra

Hi,

I'm newbie and was quite happy working with datatables until stuck with below problem.

I'm constructing HTML table dynamically from json received via ajax. After building the HTML table I'm binding it to the datatables with below code:



$("#tblSearchResults_" + instanceId).dataTable({ "bDestroy": true, "bFilter": false, "iDisplayLength": 20, "sPaginationType": "full_numbers",
"oLanguage": {
"sLengthMenu": "",
"sZeroRecords": "Nothing found - sorry",
"sInfo": "Showing _START_ to _END_ of _TOTAL_ records",
"sInfoEmpty": "Showing 0 to 0 of 0 records",
"sInfoFiltered": "(filtered from _MAX_ total records)"

}
});

I have a requirement to show/hide table columns dynamically based on user input, when i do so(show/hide works fine) as depicted by code below

var oTable = $("#tblSearchResults_" + instanceId).dataTable();
bVis = oTable.fnSettings().aoColumns[arr[i] - 1].bVisible;
oTable.fnSetColumnVis(arr[i] - 1, bVis ? false : true);

After show hide, It stops rebinding data again when i rebuild HTML table from json received via service and bind it to datatables (only works on first load)

* There is no issue with the HTML table format that I build

Any help would be much appreciated.

Many thanks

bssehra

Sorry to bother you all, this issue has been resolved. New HTML table wasn't being refreshed with new data in DOM. Removing and appending thead & tbody again fixed my issue.