Sticky header jumps around when changing columns

sonallux commented 2 years ago

The sticky header does not stay at the top when changing the column order after scrolling down.

Reproduce

Open Stackblitz: https://stackblitz.com/edit/angular-nfgsup
Scroll down more than 10 elements
Press the "Toggle columns" button
Sticky header is not at the top any more (see screenshot below)
When scrolling again the sticky header jumps to the top again

williammnarrowpath commented 2 years ago

Any update on this issue?

sonallux commented 2 years ago

update on this issue?

Not really, unfortunately. I have looked into the code a bit and found more background about what's causing this behaviour. The sticky header is kept at the top by adding top: <some offst> CSS style to the <th> element. But when the columns change, the header elements are removed and readded to the DOM, which discards the top CSS property. It is actually set to top: 0px.

Unfortunately, I have currently no idea how to reset the top property to the correct offset after the columns have been changed. Maybe @diprokon has some idea?

kiranatious commented 1 year ago

can this be fixed for 1.3.*

diprokon / ng-table-virtual-scroll

Sticky header jumps around when changing columns #105

Reproduce