Description of problem:
Hello,
Last week we did an upgrade of our Datatables 1.09 (and the old 1.x version of the editor) to the latest version but ever since we have done that we noticed that whenever we are updating some field/column the whole screen resets to the first page. Because of this its sometimes hard to know where that person was before editing the specific line.
For the update i just overwrote all the files from the editor and datatables itself.
I tried looking around but i cannot find a way to fix this. I found the stateSave (https://datatables.net/reference/option/stateSave) but i cannot get it to work.
How can i fix this problem without recreating all the pages in the hope that it solves the issue? Below is the current js that i am using.
(function($){
$(document).ready(function() {
$.fn.dataTable.render.ellipsis = function () {
return function ( data, type, row ) {
return type === 'display' && data.length > 10 ?
data.substr( 0, 10 ) +'…' :
data;
}
};
$('#tbl_smart_price').on( 'click', 'tbody td:not(:first-child)', function (e) {
editor.inline( this );
} );
var editor = new $.fn.dataTable.Editor( {
ajax: 'php/table.tbl_smart_price.php',
table: '#tbl_smart_price',
fields: [
{
"label": "id",
"name": "id"
},
{
"label": "* sku:",
"name": "sku"
},
{
"label": "ean",
"name": "ean"
},
{
"label": "* bol_id",
"name": "bol_id"
},
{
"label": "url:",
"name": "url"
},
{
"label": "titel:",
"name": "titel"
},
{
"label": "koopblok_prijs:",
"name": "koopblok_prijs"
},
{
"label": "koopblok_verkoper:",
"name": "koopblok_verkoper"
},
{
"label": "historie_2h:",
"name": "historie_2h"
},
{
"label": "historie_4h:",
"name": "historie_4h"
},
{
"label": "stock:",
"name": "stock"
},
{
"label": "lvb_stock:",
"name": "lvb_stock"
},
{
"label": "xxl_prijs:",
"name": "xxl_prijs"
},
{
"label": "cost",
"name": "cost"
},
{
"label": "aanpassing:",
"name": "aanpassing",
"def": "5"
},
{
"label": "smart_price:",
"name": "smart_price"
},
{
"label": "aanpassing_tot_cost",
"name": "aanpassing_tot_cost"
},
{
"label": "updatebaar:",
"name": "updatebaar"
},
{
"label": "tijd:",
"name": "tijd"
},
{
"label": "smart_update_timestamp",
"name": "smart_update_timestamp"
},
{
"label": "smart_price_timestamp",
"name": "smart_price_timestamp"
},
{
"label": "ageing_dagen",
"name": "ageing_dagen"
},
{
"label": "min_aanpassing",
"name": "min_aanpassing",
"def": "0"
},
{
"label": "max_aanpassing",
"name": "max_aanpassing",
"def": "15"
}
]
} );
var table = $('#tbl_smart_price').DataTable( {
stateSave: true,
stateSaveCallback: function(settings,data) {
localStorage.setItem( 'DataTables_' + settings.sInstance, JSON.stringify(data) )
},
stateLoadCallback: function(settings) {
return JSON.parse( localStorage.getItem( 'DataTables_' + settings.sInstance ) )
},
dom: 'QBfrtip',
ajax: 'php/table.tbl_smart_price.php',
columns: [
{
"data": "id"
},
{
"data": "sku"
},
{
"data": "ean"
},
{
"data": "url",
"fnCreatedCell": function (nTd, sData, oData, iRow, iCol) {
$(nTd).html("<a href='"+oData.url+"'>"+oData.url+"</a>");
}
},
{
"data": "titel"
},
{
"data": "koopblok_prijs"
},
{
"data": "koopblok_verkoper"
},
{
"data": "stock"
},
{
"data": "lvb_stock"
},
{
"data": "xxl_prijs"
},
{
"data": "aanpassing"
},
{
"data": "smart_price"
},
{
"data": "aanpassing_tot_cost"
},
{
"data": "updatebaar"
},
{
"data": "ageing_dagen"
},
{
"data": "min_aanpassing"
},
{
"data": "max_aanpassing"
}
],
fixedHeader: true,
pagingType: "full_numbers",
select: true,
pageLength: 20,
lengthChange: true,
buttons: [
{ extend: 'create', editor: editor },
{ extend: 'edit', editor: editor },
{ extend: 'remove', editor: editor },
{
extend: 'collection',
text: 'Export',
buttons: [
'copy',
'excel',
'csv',
'pdf',
'print'
]
}
]
} );
} );
}(jQuery));