Description
With scrollable="virtual" (and fixedScroll not set), sorting the Grid while scrolled down discards the internal row-height/virtualization bookkeeping without immediately reloading the correct visible range. If the user then scrolls to the top using the scrollbar, the first few rows (typically 3-5) render blank. Scrolling down slightly and back up resolves it, since that additional scroll forces the virtualization range to recalculate correctly.
Probably related to #3421
Workaround
Remount the Grid on sort change via key={JSON.stringify(sort)}, combined with the columnsState / onColumnsStateChange controlled API to preserve column reorder/resize state across the remount (see Suggested Response above).
https://codesandbox.io/p/devbox/friendly-rumple-ggczrq?workspaceId=ws_CBqzQqSbGCo1kcCtxpqDvi
Plan
KendoReact Free
Steps To Reproduce
- Render a
Grid with scrollable="virtual", columnVirtualization, sortable, and a large dataset (e.g. 100,000 rows).
- Scroll down a few hundred rows.
- Sort any column.
- Use the scrollbar to drag back to the top of the Grid.
Screenshots or video
Actual Behavior
The first few rows render blank until the user scrolls down slightly and back up again.
Expected Behavior
All rows in the visible range, including the first rows, should render immediately after returning to the top.
Browser
Chrome
Browser version
latest
OS type
MacOS
OS version
No response
Last working version of the KendoReact package (if regression).
No response
Description
With
scrollable="virtual"(andfixedScrollnot set), sorting the Grid while scrolled down discards the internal row-height/virtualization bookkeeping without immediately reloading the correct visible range. If the user then scrolls to the top using the scrollbar, the first few rows (typically 3-5) render blank. Scrolling down slightly and back up resolves it, since that additional scroll forces the virtualization range to recalculate correctly.Probably related to #3421
Workaround
Remount the Grid on sort change via
key={JSON.stringify(sort)}, combined with thecolumnsState/onColumnsStateChangecontrolled API to preserve column reorder/resize state across the remount (see Suggested Response above).https://codesandbox.io/p/devbox/friendly-rumple-ggczrq?workspaceId=ws_CBqzQqSbGCo1kcCtxpqDvi
Plan
KendoReact Free
Steps To Reproduce
Gridwithscrollable="virtual",columnVirtualization,sortable, and a large dataset (e.g. 100,000 rows).Screenshots or video
Actual Behavior
The first few rows render blank until the user scrolls down slightly and back up again.
Expected Behavior
All rows in the visible range, including the first rows, should render immediately after returning to the top.
Browser
Chrome
Browser version
latest
OS type
MacOS
OS version
No response
Last working version of the KendoReact package (if regression).
No response