We Keep Coding

jquery datatable serverside pagination stype null

I use jquery datatables with serverside processing. It works fine til press pagination battons. When user press pagination button fnServerData call with oSettings argument with no sType parametr!
for example call fnServerData after Next button:
The same call after some filter button:
Is it a datatables bug or what? how can i fix it?
UPD: my datatables initialization
var table = $("#table_id").DataTable(
{
"order": [[0, "desc"]],
"sAjaxSource": "/odata/Messages",
"iODataVersion": 4,
"aoColumns": [
{ mData: "Id", sType: "numeric" },
...
],
"fnServerData": fnServerOData,
"bServerSide": true,
"bUseODataViaJSONP": false,
"processing": true,
"lengthMenu": [[10, 100, 1000], [10, 100, 1000]]
});

As said by #Rory McCrossan over Here,
With the latest version of DataTables, you need to set the type property of the object you provide in the columnDefs array, like this:
$('#example').dataTable({
"columnDefs": [
{ "type": "num" }
]
});
Note that there are many other methods of sorting which can be found in the documentation
For more info : stype-numeric-doesnt-seem-to-work-anymore (Datatable official)

datatables fixed column not aligning in bootstrap modal

I am working with js datatables. I have a table in modal and I am trying to make make left most column fixed. Below is my script for datatables.
$('#table1').DataTable({
"dom": 'Bfrtip',
"bPaginate": false,
"bLengthChange": false,
"bInfo": false,
"bFilter": false,
"buttons": [{
extend: 'excelHtml5',
title: 'Excel1',
sheetName: 'Sheet1'
}],
scrollY: 300,
scrollX: true,
scrollCollapse: true,
paging: false,
fixedColumns: true
"ordering": false
});
Everything working fine except fixed columns. I have included fixed column css and Js.
The actual problem is, the table gets shrinks when I apply fixed columns.

Give this a try:
$('#modal_ID').on('shown.bs.modal', function (e) {
$($.fn.dataTable.tables(true)).DataTable().columns.adjust();});

you must have explicitly ' style="width:100%" in table attibute (not in css)

how to stay in current page after Updating datatable DOM

I am working with data table , every thing is fine but now i need to stay on current page after updating and refresh page. Currently it comes in first page after update. I am using Data-table DOM.
$("#dataTable").dataTable({
"order": [],
"columnDefs": [{
"targets" : 4,
"orderable": false,
}]
});

Happy Coding :)
$(document).ready(function() {
$('#example').DataTable( {
stateSave: true
} );
});

Datatable Fixed Column (Right Only) Issue

I'm using JQuery Datatable and I ran into a problem when I used fixed column.
It has been showing two times my fixed column
I'm using serverside processing and that's my code:
dataTable = table.dataTable({
fixedColumns: {
leftColumns: 0,
rightColumns: 1
},
scrollX:true,
scrollCollapse: true,
"fnDrawCallback":function(oSettings) {
$('div.choosePage select').val(dataTable.DataTable().page());
},
"pagingType":"bootstrap_full_number",
"processing": true,
"serverSide": true,
"ajax": {
"data":GETDATA,
"dataSrc":SETAJAXDATA
},
"fnInitComplete":completeProcess,
"colReorder": true,
"order": [
[0, 'asc']
],
"dom": "<'row' <'col-md-12'>><'row'<'col-md-6 col-sm-12'f>r><'table-scrollable't><'row'<'col-md-4 col-sm-12'i><'col-md-5 col-sm-12 toolbar'p><'col-md-push-1 col-md-3 col-sm-12 toolbar choosePage'>>", // horizobtal scrollable datatable
})
Ajax is working good and there is no problem when I used fixed column on left side,but when I used it on right side i'm running into this problem.
Thanks.

I believe it is a bug in Jquery Datatable if you haven't setup scrollY from the options, make sure you set some value.
Because when you inspect the element you can see scroll-y overflow is auto. If you set it as hidden or not setup a value from the options, there you go, you see the space at the right side.
Incase you do not want to use scroll-y at all, then you need to make your hands dirty with some css code by giving some minor margin which is an ugly solution. But I cannot see any other option for you.
It's a shame for Jquery datatable plugin.
Below shows an example option list from the plugin website.
$(document).ready(function() {
var table = $('#example').DataTable( {
scrollY: "300px",
scrollX: true,
scrollCollapse: true,
paging: false,
fixedColumns: {
leftColumns: 0,
rightColumns: 1
}
} );
} );

Jquery datatable creating extra header on chrome browser when using scrollX property

('#instant-quotes').DataTable({
"data": dataSet,
"scrollY": yscroll,
/*"initComplete": function(settings, json) {
$('#instant-quotes thead tr:first').remove();
},*/
"dom": "lfrti",
"scrollCollapse": false,
"bSortCellsTop": false,
"info": false,
"processing": true,
"bLengthChange": false,
"searching": false,
"pageLength": 7,
"order": [ 0, "desc" ]...
})
When i use the datatable with the scrollX property it always append a blank <thead> with a <tr>.I dont why this occurs but its always doing this,however i removed by using jquery
$('#instant-quotes thead tr:first').remove()
But i dont think so its a good solution because when i sort or redraw the table then this blank <thead> again appears, also when i change the layout (coz its responsive) then it appears again,
Kindly suggest a better and optimal solution.