How to add static column(s) in Jquery DataTable.
How to add static column(s) in Jquery DataTable.
I am using Jquery DataTable. I have binded few columns. In that few columns are static and few are dynamic.
So currently I have binded around 20 columns (static + dynamic) in DataTable. Now, I have binded till to 20 cols now suppose if I am binding 21 cols it's gives me error like
"DataTables warning: table id=DataGrid - Invalid JSON response. For more information about this error, please see http://datatables.net/tn/1"
I am binding server side process. here is my code as below
var Tblheader = ''; var trHTML = '';
Re_Bind_DataTable();
$("#DataGrid").empty()
Tblheader = '<thead><tr><th rowspan="2" style="width: 5%;">Excl.</th><th rowspan="2">CUC</th> <th rowspan="2"> Late Model </th><th colspan="2">' + '1 Year Rank </th><th colspan="2"> 1 Year Sales Qty </th> <th rowspan="2"> Whse Looksup </th><th colspan="12" align="center"> Qty of Parts Sold by Mo.' + '</th> <th rowspan="2"> Days OOS </th> <th rowspan="2"> On Hand </th> <th colspan="4" align="center"> Re-Order High </th> <%--<th> </th>--%> ' + '</tr> <tr> <th> Whse </th> <th> Region </th><th> Whse </th> <th>Region</th><th> 12 </th> <th>11</th> <%--<th> .... </th>--%> <th class="cellhidden"> ' + '10 </th> <th class="cellhidden">9 </th> <th class="cellhidden"> 8 </th> <th class="cellhidden"> 7 </th> <th class="cellhidden"> 6 </th>' + '<th class="cellhidden"> 5 </th> <th class="cellhidden">4 </th> <th> 3</th> <th>2 </th> <th> 1 </th> <th> Current </th> <th> Diff </th> <th>' + ' Recomd </th> <th> Last </th> <%--<th> </th>--%> </tr> </thead>';
$("#DataGrid").append(Tblheader);
$('#DataGrid').DataTable({
"iDisplayLength": 25,
"aaSorting": [[0, 'desc']],
"bServerSide": true,
"bProcessing": false,
"bPaginate": true,
"sDom": 'fltip',
"bDeferRender": true,
"sAjaxSource": '<%= Url.Action("GetROHNoRankSKU1") %>',
"fnServerParams": function (aoData) { aoData.push({ "name": "WhseID", "value": $("#ddlWarehouse").val() }, { "name": "strCatg", "value": $("#ddlCategory").val() }) },
"aoColumns": [{ sWidth: '1%' }, { sWidth: '5%' }, { sWidth: '5%' }, { sWidth: '5%' }, { sWidth: '5%' }, { sWidth: '5%' }, { sWidth: '5%' }, { sWidth: '5%' }, { sWidth: '5%' }, { sWidth: '5%' }, { sWidth: '5%' }, { sWidth: '5%' }, { sWidth: '5%' }, { sWidth: '5%' }, { sWidth: '5%' }, { sWidth: '5%' }, { sWidth: '5%' }, { sWidth: '5%' }, { sWidth: '5%' }, { sWidth: '5%' }, { sWidth: '5%' }, { sWidth: '5%'}],
"fnInitComplete": function (oSettings, json) {
setTimeout(function () { $.loader('close'); }, 1000);
}
});
}
Please help