Responsive plugin errors on resize
Responsive plugin errors on resize
zyrolasting
Posts: 4Questions: 2Answers: 0
Hi!
When resizing the viewport using the Responsive plugin, the console floods with Uncaught TypeError: Cannot read property 'style' of undefined.
In the debug release of DataTables the break occurs on line 4166, which is line 4 in the snippet below. headerCells[i] is undefined since visibleColumns is larger than headerCells.
for ( i=0 ; i<visibleColumns.length ; i++ ) {
column = columns[ visibleColumns[i] ];
headerCells[i].style.width = column.sWidthOrig !== null && column.sWidthOrig !== '' ?
_fnStringToCss( column.sWidthOrig ) :
'';
}
We confirmed that our configuration contains no trailing commas in the IE8 case, and this reproduces in Chrome 44.
We do not get the Warning: possible column misalignment message, but I am reading through apparently relevant technical notes anyway. My initial guess is that our issue is that we are using scrollY but not scrollX.
I am not comfortable using the DataTables debugger because the table contains proprietary data that I don't want the bookmarklet to upload, but I can at least show you (part of) our config to see if there's something wrong with it.
{
retrieve: true,
destroy: true,
processing: false,
serverSide: true,
searchDelay: 1000,
autoHeight: false,
bDeferRender: true,
iDisplayLength: defaultPageSize, // computed
oScroller: {
'loadingIndicator': true
},
scrollCollapse: true,
dom: 'frtiS',
sScrollY: defaultScrollY, // computed
responsive: true,
language: {
processing: "Loading..."
}
}
Will update as I go, but are there any other leads that I should investigate?
Answers
The issue was that we did not perform necessary adjustments to the table configuration after defining sScrollY. Issue resolved by adding
bAutoWidth: falseand$(window).resize(dt.columns.adjust().draw)Could you try using the DataTables 1.10.8-dev nightly please? That should resolve the issue.
Allan