This is a migrated thread and some comments may be shown as answers.

Grid Navigation and Virtual Scrolling

18 Answers 265 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Tony
Top achievements
Rank 1
Tony asked on 23 Mar 2012, 12:16 AM
Hi guys,

Using the navigatable property (navigable?) on a grid with data virtualization and scrolling set to {virtual: true} doesn't scroll as i use the down arrow key. The selected row disappears off the bottom of the grid into the hidden overflow area. I've noticed that navigation works correctly and scrolls the grid when using scrolling set to true.

Tony

18 Answers, 1 is accepted

Sort by
0
Accepted
Nikolay Rusev
Telerik team
answered on 23 Mar 2012, 01:44 PM
Hello Tony,

I am afraid that keyboard navigation and virtual scrolling is not supported.

All the best,
Nikolay Rusev
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Scott
Top achievements
Rank 2
answered on 11 Aug 2012, 07:46 PM
Are there any plans to support this, as it pretty much makes virtual scrolling very un-user friendly especially if the grid has editable elements on it....?

Or is there any way to hack it via jQuery and focus/scroll events to make it scroll when navigating via keyboard?
0
Nikolay Rusev
Telerik team
answered on 15 Aug 2012, 03:05 PM
Hello Scott,

Unfortunately supporting navigation and virtual scrolling is not a trivial task. For Q3'12 one of the major tasks is keyboard support over the widgets as well as accessibility enhancements. We will try to implement support for navigation and virtual scrolling, but I cannot 100% guarantee you that it will make it for Q3'12.

Greetings,
Nikolay Rusev
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Rashard
Top achievements
Rank 1
answered on 30 Aug 2012, 04:32 AM
Nikolay,

To confirm are you saying there is no current way to use the keyboard to navigate an editable grid?

Thanks,
Rashard
0
ITS
Top achievements
Rank 1
answered on 31 May 2013, 12:58 AM
Hello

Any news on the progress of this issue?

Thanks
0
Nikolay Rusev
Telerik team
answered on 31 May 2013, 06:28 AM

No, keyboard navigation in Grid with virtual scrolling enabled is not supported.

Regards,
Nikolay Rusev
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Omar
Top achievements
Rank 1
answered on 20 Sep 2013, 09:29 AM
Any news regarding this issue? Are there any fix or workarounds?
0
Nikolay Rusev
Telerik team
answered on 23 Sep 2013, 08:48 AM
Hello Omar,

Keyboard navigation in Grid with virtual scrolling enabled is not supported and it is not part of our immediate plans.

Regards,
Nikolay Rusev
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
0
Dorian
Top achievements
Rank 2
answered on 06 Jun 2014, 06:31 AM
Are there any plans at all to bring together this much needed feature? It's a must feature for what  I'm working on
0
Nikolay Rusev
Telerik team
answered on 11 Jun 2014, 06:02 AM
Hello Dorian,

It is in our to do list, but as stated in the previous post it isn't part of our immediate  plans.

Regards,
Nikolay Rusev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Nikolay Rusev
Telerik team
answered on 15 Dec 2014, 08:39 AM
Hello Simon,

Actually the two issues are different. The first is related to keyboard navigation in virtual scrollable grid while the second to the virtual scrolling itself.

Regards,
Nikolay Rusev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Simon
Top achievements
Rank 1
answered on 15 Dec 2014, 12:34 PM
Hello Nicklay,

Indeed, the requests are different.  However, if the second one is done, we can use it to fix the first one.
0
IT Department
Top achievements
Rank 1
answered on 02 Dec 2015, 10:58 PM

Hi,

Is Telerik planning to add support for combining virtual scrolling with Keyboard navigation anytime soon? The keyboard navigation commands are great on their own  but fall short with a grid scrollbar. We have data entry users that live and die using keyboard short cuts. I've worked around the issue by removing scrollbars on grids and turning on paging, but the data entry users weren't impressed. They prefer keeping the scroll bar and not using paging. Your assistance would be appreciated.

 Alex B.

 

0
Nikolay Rusev
Telerik team
answered on 08 Dec 2015, 07:30 AM

Hello Alex,

 

There is already keyboard support for Grid with virtual scrolling. I guess you haven't tried it.

 

Here is an example - http://dojo.telerik.com/@rusev/eZIdA

 

Regards,
Nikolay Rusev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Giovanni
Top achievements
Rank 1
answered on 17 May 2016, 02:51 PM

Hi Nikolay, I ended up on this page because I'm noticing an issue in the keyboard navigation with virtual scrolling in my application. I just went to the example you offer and lo and behold, the same thing happens in the example. In my application, as I scroll down my grid using the keyboard, the row selection skips over one row every 40 rows. This is not obvious at first, but after I added a column containing a sequential row number, then it was more obvious to notice.

In your example above, I was able to reproduce this 3 times: if you use the down arrow, you will end up skipping Order ID 10340. The cursor jumps from 10339 to 10341. In Full Screen mode it skips Order ID 10343.

Is this a known issue? This is problematic for us because users have to review each row for quality control so skipping a row can mean a liability for us.

Thanks.

0
Nikolay Rusev
Telerik team
answered on 20 May 2016, 11:33 AM

Hello Giovanni,

I assume you are talking about the behavior demonstrated in the video bellow, i.e jumping from *39 to *41 directly. Am I correct?

http://screencast.com/t/z9d3ELlujN

Keyboard navigation with virtual scrolling approximates the scroll position to which virtual scroller must be moved in order to navigate to next page of data. At the same time it attempts to highlight the item in the middle of the view port.

All the above plus the possibility of differences in the row height is the best we can accomplish for the scenario of keyboard navigation and virtual scrolling.

Regards,
Nikolay Rusev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Timothy
Top achievements
Rank 1
answered on 15 Aug 2016, 03:06 PM

Hay guys - regarding keyboard navigation with scrolling, i've found that scrolling down skips one row, and scrolling up repeats the same row. This is because the kendo grid scrollable extensions itemIndex() and position() aren't actually reflections of one another, though the code makes it seem that they should be. 

The behaviour can be fixed by patching itemIndex to look like this:

       itemIndex: function(rowIndex) {
           var rangeStart = this._rangeStart || this.dataSource.skip() || 0;
           return rangeStart + rowIndex - 1;
       },

 

Tags
Grid
Asked by
Tony
Top achievements
Rank 1
Answers by
Nikolay Rusev
Telerik team
Scott
Top achievements
Rank 2
Rashard
Top achievements
Rank 1
ITS
Top achievements
Rank 1
Omar
Top achievements
Rank 1
Dorian
Top achievements
Rank 2
Simon
Top achievements
Rank 1
IT Department
Top achievements
Rank 1
Giovanni
Top achievements
Rank 1
Timothy
Top achievements
Rank 1
Share this question
or