ColVis & Datatable integration problem when scrollY is enabled.

jserdaru

Please see jsfiddle below:

https://jsfiddle.net/r4r85yqd/1/

setting the scrollY parameter doesn't play nice with ColVis:

Click on "Show/hide columns"
Deselect any column to make it invisible. Select it again.

Firebug:
TypeError: headerCells[i] is undefined

Internet explorer 10:
SCRIPT5007: Unable to get property 'style' of undefined or null reference
File: jquery.dataTables.js, Line: 4165, Column: 5

Chrome:
Uncaught TypeError: Cannot read property 'style' of undefined_fnCalculateColumnWidths @ jquery.dataTables.js:4165_fnAdjustColumnSizing @ jquery.dataTables.js:764__setColumnVis @ jquery.dataTables.js:8292(anonymous function) @ jquery.dataTables.js:8370_Api.iterator @ jquery.dataTables.js:6905(anonymous function) @ jquery.dataTables.js:8366(anonymous function) @ jquery.dataTables.js:7154(anonymous function) @ jquery.dataTables.js:7038fnSetColumnVis @ jquery.dataTables.js:5938(anonymous function) @ dataTables.colVis.js:642jQuery.event.dispatch @ jquery-2.1.3.js:4430elemData.handle @ jquery-2.1.3.js:4116

I tried the following fix (adding a if line 4165) and it seems to solve the problem.

            if(headerCells[i]) {
                headerCells[i].style.width = column.sWidthOrig !== null && column.sWidthOrig !== '' ?
                        _fnStringToCss( column.sWidthOrig ) :
                        '';
            }

jadth

I can also confirm that an exception is thrown when a hidden column is made visible via a simple call like this:

table.column( column_name + ':name' ).visible( true );

Previously I also had a similar problem with dynamically created footer cells - the handling of header and footer cells seems to be very different to that of data cells, especially when using scrollY.

jserdaru: thanks for the code snippet!