search

DataTables / FixedHeader

Fix the header, footer, left or right columns of a table in place, to always show them when scrolling
http://www.datatables.net/
Other
75 stars 83 forks source link

Misplaced header when resizing window after scrolling #87

Closed ahoppen closed 6 years ago

ahoppen commented 8 years ago

Description

If you have a DataTable that is not aligned with the top of the page, has fixedHeader enabled and scrollY set, scroll to the bottom of the table (less scrolling also works, but no pattern could be detected so far) and then resize the window, the table's header is added to the current page's body, being displayed on the top of the page.

screen shot 2016-11-15 at 14 25 06

This header is obviously unintended and should not be visible

Sample project

Please find a fully self-contained sample project, demonstrating the issue attached: DataTables Bug.zip

Investigation results

The header gets added to the DOM tree in the _clone method of FixedHeader. Specifically in this statement:

itemDom.floating = $( dt.table().node().cloneNode( false ) )
    .css( 'table-layout', 'fixed' )
    .removeAttr( 'id' )
    .append( itemElement )
    .appendTo( 'body' );

Removing the last line appendTo( 'body' ) seems to resolve the issue for fixed headers but since I can't believe that the line is useless, I refrained from filing a pull request.

FixedColumns

This bug also seems to stop FixedColumns from showing a fixed column after the resize. Uncomment the lines enabling FixedColumns in bug.html in the attached sample project to see the issue.

DataTables commented 8 years ago

Hi,

Thanks for the detailed bug report! I'm sorry to say that FixedHeader is not currently compatible with the scrolling features in DataTables (see the compatibility chart).

Issues #7 and #80 cover this. It is certainly something I plan to add in future - I'm slightly nervous about the extra complexity it will add, I think the basics will actually be really easy with how FixedHeader works now, but getting it right will probably be quite fiddily!

ahoppen commented 8 years ago

Thanks for the update.

I didn't even know FixedHeader wasn't compatible with scrolling and FixedColumns because it always worked well for me.

DataTables commented 6 years ago

Going to close as a duplicate.