Scroll positions not saved when using fixed columns
Scroll positions not saved when using fixed columns
amaphil
Posts: 1Questions: 1Answers: 0
Link to test case: nope
Debugger code (debug.datatables.net): "an error occurred, sorry"
Error messages shown: none
Description of problem:
Hello there, it seems that in all our tables that are using fixed columns, saving of the scroll positions is broken.
On pages with fixed columns:
$.fn.dataTable.tables( { visible: true, api: true }).scroller.page().start
returns 0
On pages without fixed columns:
$.fn.dataTable.tables( { visible: true, api: true }).scroller.page().start
returns the actual vertical scroll position, e.g. 52
I tried finding out how and where the scroll positions are being stored after a submit, so far to no avail.
Unfortunately the debugger runs into an error on upload, so all I can really do is provide the configurations:
On the jsp (yes, still using those...):
jQuery(document).ready(function() {
var oTable = jQuery("#DataTable");
initializeTaxFormDataTable(oTable, {fixedColumns: {leftColumns: 5}, calcHeight: true}, {showHeader: false, hideHeader: false});
} );
jQuery(window).on('resize', function(){
setTimeout(function() { $.fn.dataTable.tables( { visible: false, api: true } ).columns.adjust().fixedColumns().relayout(); }, 250);
});
In the customized datatables.js:
function initializeTaxFormDataTable(oTable, options, buttons, isPaging) {
/// ...
var colCount = getDataTableColumnCount(oTable);
var scrollCollapse = options.scrollCollapse;
var calcHeight = options.calcHeight;
var showHeader = buttons.showHeader;
var hideHeader = buttons.hideHeader;
var fixColumns = buttons.fixColumns;
var noOfFixedColumns = buttons.noOfFixedColumns;
useJqueryUi = false;
var defaults = {
"scrollY" : "75vh",
"scrollX" : true,
"jQueryUI" : isNullOrEmpty(useJqueryUi) ? true : useJqueryUi,
"scrollCollapse" : scrollCollapse,
"lengthChange" : false,
"searching" : true,
"ordering" : false,
"info" : false,
"autoWidth" : false,
"language" : getDataTableLang(),
"stateSave" : true,
"pagingType" : "full",
"dom" : 'T<"H"Bfr>tS<"F">',
"initComplete" : function(settings, json) {
jQuery("#load-overlay").hide();
jQuery("#printDiv").hide();
jQuery("#excelDiv").hide();
},
"stateSaveParams" : function(settings, data) {
var api = new $.fn.dataTable.Api(settings);
if (api.buttons('colvisRestore')) {
api.buttons('colvisRestore').trigger();
}
},
"buttons" : [],
"scroller" : {
displayBuffer : 1000
}
};
var settings = jQuery.extend({}, defaults, options);
settings = jQuery.extend({}, settings, getDataTableLang());
var datatable = oTable.DataTable(settings);
var buttonPos = 0;
if (showHeader) {
$.fn.dataTable.ext.buttons.showHeader = createButtonShowHeader();
datatable.button().add(buttonPos, {
extend : 'showHeader',
className : 'showHeaderButton'
})
buttonPos++;
}
if (hideHeader) {
$.fn.dataTable.ext.buttons.hideHeader = createButtonHideHeader();
datatable.button().add(buttonPos, {
extend : 'hideHeader',
className : 'hideHeaderButton'
})
buttonPos++;
}
if (fixColumns) {
$.fn.dataTable.ext.buttons.fixColumns = createButtonFixColumns(noOfFixedColumns);
datatable.button().add(buttonPos, {
extend : 'fixColumns',
className : 'buttons-fix-columns'
})
}
relocateDataTableButtons(isPaging);
oTable.DataTable().columns.adjust();
setTimeout(function () {
$.fn.dataTable.tables({visible: false, api: true}).columns.adjust().fixedColumns().relayout();
}, 250);
}
We are currently using DataTables 1.10.18
Thanks in advance
This discussion has been closed.
Answers
Hi,
First thing to do would be to update your DataTables install. 1.10.18 is quite old now - 1.12.1 is the current release. Note that we don't attempt to store the horizontal scroll position at this time.
Allan