Multiple Table Scrolling

Toyb

I have two tables that have the same number of rows. How can I synchronize the tables when scrolling vertically to keep the rows aligned? In other words, scrolling one table causes the second table to scroll too.

Thanks

allan

There isn't a built in option for that in DataTables, but you could add a scroll event listener to each (target the parent element of the table in question, after the DataTable has initialised) that will scroll other other table.

One important thing here is that when you set the scrolling on the second table, it will cause a scroll event, which would trigger the event listener and cause the first table to scroll, and ... You get the idea.

Perhaps the best way to combat that is to add the scroll event listener only on mouseenter for each table, and remove it on mouseleave.

We used to do something along those lines in FixedColumns (v4 removed the need for that with the use of position: sticky in CSS).

Allan

Toyb

Thanks Allan!!