Prevent Partial Rows on When Scrolling

[Keith]

I need the grid to scroll exactly one row with each mouse wheel click, or each click on the scroll bar arrows, and if I click in the scroll bar somewhere, it has to match up perfectly with the displayed rows without showing any partial rows. In short, I am required to never display a partial row.

Is there a way to enforce this with the kendoGrid? Or what is the basic approach that you might suggest for tackling this behavior in a general way?

Currently, each row is set to 15px height, and the content area is set to 240px, allowing for a total of 16 visible rows at a time. It looks great on load, but when I start to scroll down, the scroll does not match exactly with each row height. This means there might be a row that is partially displayed on both the top and bottom of the scrollable area.



Here's how I've configured the columns:

columns: [
                {field:"one",
                    title: "One",
                    attributes:{
                        style: "width:60px; height:15px; border: 0px;"
                    },
                    headerAttributes:{
                        style:"width:60px; height:20px; border-right:1px solid gray;"
                    }},

                {field:"two",
                    title: "Two",
                    attributes:{
                        style: "width:170px; height:15px; border: 0px;"
                    },
                    headerAttributes:{
                        style:"width:170px; height:20px; border-right:1px solid gray;"
                    }}
            ]

/*snip*/
$tableGrid.find(".k-grid-content").height(240);

[Nikolay Rusev]

Hello Keith,

The Grid doesn't offer such functionality. The scroll bar you see in the grid is the native browser scroll bar and it is behaving as such.

You can intercept the `scroll` event for the `.k-grid-content` element and within that handler implement your requirement.

Regards,
Nikolay Rusev
Telerik

[Keith]

On a seperate post it had been mentioned that the grid does not autoscroll when using keyboard navigation if the virtual scroll is set.

http://docs.telerik.com/kendo-ui/getting-started/web/grid/walkthrough#scrolling

Most of the grids in question are using virtual scrolling. How might it possibly effect the virtual scroll functionality if I were to intercept the scroll event as you suggest?

[Nikolay Rusev]

Hello Keith,

Indeed virtual scrolling and keyboard navigation is not supported. Unfortunately there isn't reliable way of handling the current (currently highlighted cell due to navigation) when the user scroll the grid and next batch of items is rendered in the grid.

Regards,
Nikolay Rusev
Telerik

[Keith]

Thanks for the confirmation.