Grid Navigation and Virtual Scrolling

19 posts, 1 answers
  1. Tony
    Tony avatar
    23 posts
    Member since:
    May 2011

    Posted 22 Mar 2012 Link to this post

    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

  2. Answer
    Nikolay Rusev
    Admin
    Nikolay Rusev avatar
    2284 posts

    Posted 23 Mar 2012 Link to this post

    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!
  3. Kendo UI is VS 2017 Ready
  4. Scott
    Scott avatar
    68 posts
    Member since:
    Nov 2011

    Posted 11 Aug 2012 Link to this post

    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?
  5. Nikolay Rusev
    Admin
    Nikolay Rusev avatar
    2284 posts

    Posted 15 Aug 2012 Link to this post

    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!
  6. Rashard
    Rashard avatar
    1 posts
    Member since:
    Aug 2011

    Posted 29 Aug 2012 Link to this post

    Nikolay,

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

    Thanks,
    Rashard
  7. ITS
    ITS avatar
    7 posts
    Member since:
    Oct 2010

    Posted 30 May 2013 Link to this post

    Hello

    Any news on the progress of this issue?

    Thanks
  8. Nikolay Rusev
    Admin
    Nikolay Rusev avatar
    2284 posts

    Posted 31 May 2013 Link to this post


    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!
  9. Omar
    Omar avatar
    1 posts
    Member since:
    Sep 2013

    Posted 20 Sep 2013 Link to this post

    Any news regarding this issue? Are there any fix or workarounds?
  10. Nikolay Rusev
    Admin
    Nikolay Rusev avatar
    2284 posts

    Posted 23 Sep 2013 Link to this post

    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!
  11. Dorian
    Dorian avatar
    21 posts
    Member since:
    Nov 2013

    Posted 06 Jun 2014 Link to this post

    Are there any plans at all to bring together this much needed feature? It's a must feature for what  I'm working on
  12. Nikolay Rusev
    Admin
    Nikolay Rusev avatar
    2284 posts

    Posted 11 Jun 2014 Link to this post

    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!
     
  13. Nikolay Rusev
    Admin
    Nikolay Rusev avatar
    2284 posts

    Posted 15 Dec 2014 Link to this post

    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!
     
  14. Simon
    Simon avatar
    159 posts
    Member since:
    Sep 2010

    Posted 15 Dec 2014 in reply to Nikolay Rusev Link to this post

    Hello Nicklay,

    Indeed, the requests are different.  However, if the second one is done, we can use it to fix the first one.
  15. IT Department
    IT Department avatar
    1 posts
    Member since:
    May 2009

    Posted 02 Dec 2015 Link to this post

    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.

     

  16. Nikolay Rusev
    Admin
    Nikolay Rusev avatar
    2284 posts

    Posted 08 Dec 2015 Link to this post

    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!
     
  17. Giovanni
    Giovanni avatar
    3 posts
    Member since:
    Feb 2016

    Posted 17 May in reply to Nikolay Rusev Link to this post

    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.

  18. Nikolay Rusev
    Admin
    Nikolay Rusev avatar
    2284 posts

    Posted 20 May Link to this post

    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!
     
  19. Timothy
    Timothy avatar
    3 posts
    Member since:
    Mar 2016

    Posted 15 Aug in reply to Giovanni Link to this post

    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;
           },

     

Back to Top
Kendo UI is VS 2017 Ready