Issue with colReorder and colVis - Columns display in the wrong order
Issue with colReorder and colVis - Columns display in the wrong order
Hi everyone!
I'm using Datatables 1.10.12 and I have a problem. My table needs to have the ability to change colmun order and to show/hide columns. So I use colReorder and colVis. colReorder works fine.
But when I hide a column and show it again, the header displays at the right place, but the column content displays in the last column of the table. So the whole content of my table moves one columns on the left...
I have been trying to solve this for hours but I can't find the solution!
Thanks a lot for your help!
Here is my code:
$(document).ready(function() {
var table = $('#tableau').DataTable( {
colReorder: true,
paging: false,
ordering: true,
info: true,
scrollY: '50vh',
scrollX: true,
bFilter: true,
stateSave: true,
select: true,
dom: "B<'clear'>lfrtip",
buttons: [
{
extend: 'colvis',
postfixButtons: [ 'colvisRestore' ]
}
],
language: {
select: {
rows: {
_: "%d lignes sélectionnées",
0: "",
1: "1 ligne sélectionnée"
}
},
url: 'datatables/french.lang'
},
"stateSaveCallback": function (settings, data) {
$.ajax( {
"url": "ajax/dbManager.php?action=save",
"data": {"name":"etat_parc.php", "state": data} ,//you can use the id of the datatable as key if it's unique
"dataType": "json",
"type": "POST",
"success": function () {}
});
},
"stateLoadCallback": function (settings) {
var o;
$.ajax( {
"url": "ajax/dbManager.php?action=load",
"data":{"name":"etat_parc.php"},
"async": false,
"dataType": "json",
"type": "POST",
"success": function (json) {
o = json;
}
} );
return o;
}
} );
Answers
I have worked on my issue and found out that if I turn the stateSave statement to 'false', the columns show and hide perfectly...
But I really need the stateSave option to be active...
Anyone has encountered this problem before?
Thanks!!