Issue w/ Bootstrap5 + fixedHeader + scrollY

Issue w/ Bootstrap5 + fixedHeader + scrollY

cesaroscesaros Posts: 3Questions: 1Answers: 0

Link to test case: https://codepen.io/cesaros/pen/QWzvdpJ
Debugger code (debug.datatables.net): https://debug.datatables.net/idesov
Error messages shown:
Description of problem: I have a table that I want to be scrollable. I haven't had any problems scrolling horizontally, only vertically. I'm also using a fixedHeader offset to work with my page's navbar. Once I introduce scrollY to contain the table into a smaller window the header of the table is shown near the bottom of the page after I scroll past the table.

I have not been able to reproduce this problem using only datatables. Once I introduce the bootstrap styling I run into this issue so I think the conflict is there but can't say for certain. Hopefully I'm missing something simple that I've overlooked.
Any ideas?

This question has an accepted answers - jump to answer

Answers

  • colincolin Posts: 15,240Questions: 1Answers: 2,599

    It seems to be working OK on the example you posted above. Are you able to link to a page, please, that demonstrates the issue?

    Colin

  • cesaroscesaros Posts: 3Questions: 1Answers: 0

    Thanks for the reply, Colin. It works mostly as expected. My bad, I forgot to mention it depends on the length of the page. I was working in a smaller/narrow view port so I was able to scroll past the table. I've added more dummy text to make the page long enough to, hopefully, show the problem. Once the table is no longer visible on the page that's when I see the problem. see screenshot below

    I can omit the scrollY option and it works fine, but in production I'm working with a larger table that has 200+ rows. I don't want to have to force users to scroll past the entire table to see the content that follows, especially in mobile/smaller screens.

    Let me know if I can clarify anything. I appreciate the help

  • allanallan Posts: 63,597Questions: 1Answers: 10,485 Site admin
    Answer ✓

    Thanks for the test case!

    I tracked it down to an issue with the calculation when the table is scrolling and does not have a tfoot element.

    I've committed a fix for it and the nightly will have it included shortly.

    Regards,
    Allan

  • cesaroscesaros Posts: 3Questions: 1Answers: 0

    Thanks Allan!

Sign In or Register to comment.