Setting initial scroll in tables in reactjs

Question

Is there a way to set initial scroll in reactjs material-ui tables?

The table I am using has many columns, and would prefer if some of the columns come into view automatically upon loading without scrolling i.e. setting initial scroll.

Is this even possible, and if yes, how?

kiran kumar · Accepted Answer · 2019-10-15 04:35:05Z

1

You can check scrollLeft and scrollTop. You can change the property using javascript

answered Oct 15, 2019 at 4:35

kiran kumar

1104 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

tsuki · Accepted Answer · 2020-03-13 02:24:50Z

0

So, I found the solution best suited for myself.

I took three references:

one for the parent table
one for the first column of the table
one for the column till where I have to scroll

then within the useLayoutEffect, I use the getClientBoundingRect to get the coordinates of the two columns and finally use the tableRef.current.scrollTo() with the difference between the coordinates to scroll to the required position.

answered Mar 13, 2020 at 2:24

tsuki

3151 gold badge4 silver badges10 bronze badges

Collectives™ on Stack Overflow

Setting initial scroll in tables in reactjs

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related