devextreme-reactive
devextreme-reactive copied to clipboard
Reset virtual table scroll position
- [x] I have searched this repository's issues and believe that this is not a duplicate.
I'm using ...
- [x] React Grid
- [ ] React Chart
- [ ] Vue Grid
Current Behaviour
Changing the data for VirtualTable, keeps the scroll position. This is useful in some cases, like loading more data on scroll but if I want to change completely the data I also want to reset the scroll position.
Expected Behaviour
Possibility to reset the scroll position.
Steps to Reproduce (for Bugs)
Environment
- devextreme-reactive: 1.7.0
- react: 16.5.2
- browser: Version 69.0.3497.100 (Official Build) (64-bit)
- bootstrap: none
- react-bootstrap: none
- material-ui: 3.0.2
Hi,
Currently, we don't have built-in functionality to achieve your case. We will consider your suggestion for future releases though.
As a workaround, you can use Element.scrollIntoView function. As a target element, you can use the first row of a table.
Hello, I am trying to use scrollIntoView, and in my case I load new data also to the top of list. So I need reset skip parameter to 0 of React Grid to start load data from zero position. How can I do that?
@kkataev This kind of works but then is reset to the previous cursor position. Might be a problem with other code I have though. Assumes skip is state or a prop -
useEffect(() => {
if (skip === 0) {
try {
var element = document.querySelector('.table tbody > tr');
if (element) {
console.log(element);
element.scrollIntoView();
element.scrollIntoView(false);
}
} catch (err) {
console.error(err);
}
}
}, [skip]);