Grid paging not working with keyboard

3 posts, 1 answers
  1. Justin
    Justin avatar
    12 posts
    Member since:
    Feb 2015

    Posted 16 Nov 2015 Link to this post

    I'm having some accessibility issues with my Kendo MVC Grid. When using the Tab button I am unable to access the pages options at the bottom left corner of the grid. After looking over your documentation I've seen that pressing ALT + Page Up or ALT + Page Down should allow me to move through the pages. Unfortunately this does not work and I'm unsure what may be causing this issue. Here is an example of my code.

                  .HtmlAttributes(new {style = " width:100%; height:86%"})
                  .Pageable(pageable => pageable
                    .Messages(msg => msg.Display("{0:d0} - {1:d0} of {2:d0} items"))
                  .Reorderable(reorder => reorder.Columns(true))
                  .Sortable(sort => sort.SortMode(GridSortMode.MultipleColumn))
                  .Filterable(ftb => ftb.Mode(GridFilterMode.Row))
                  .Resizable(resizable => resizable.Columns(true))
                  .Scrollable(o => o.Height("100%"))
                  .DataSource(dataSource => dataSource
                      .Read(read => read.Action("GetUsers", "AppUser", new RouteValueDictionary {{"area", "AppUser"}}))
                  .Columns(columns =>
                      columns.Bound(o => o.Id)
                              "# if(" + @ViewBag.DOD + " == 'true')  { # +" +
                              "<a href=\"javascript: void(0);\" onclick=\"userEditItem('#: Id #');\" title=\"Edit\"><i class=\"disabled fa fa-pencil-square-o fa-lg\"></i><span class=\"sr-only\"></span></a>"
                              + "# } else { # " +
                              "<a href=\"javascript: void(0);\" onclick=\"userEditItemCAC('#: Id #');\" title=\"Edit\"><i class=\"active fa fa-pencil-square-o fa-lg\"></i><span class=\"sr-only\"></span></a>"
                              + "# } #" +
                              "<a href=\"javascript: void(0);\" onclick=\"impersonate('#: Id #');\" title=\"Impersonate User\"><i class=\"active fa fa-user fa-lg\"></i><span class=\"sr-only\"></span></a>"
                      columns.Bound(o => o.LastName)
                          .Filterable(ftb => ftb.Cell(cell => cell.Operator("contains")));
                      columns.Bound(o => o.FirstName)
                          .Title("First Name")
                          .Filterable(ftb => ftb.Cell(cell => cell.Operator("contains")));
                      columns.Bound(o => o.Email)
                          .Filterable(ftb => ftb.Cell(cell => cell.Operator("contains")));
                      columns.Bound(o => o.Phone)
                          .Filterable(ftb => ftb.Cell(cell => cell.Operator("contains")));
                      columns.Bound(o => o.Organization)
                          .Filterable(ftb => ftb.Cell(cell => cell.Operator("contains")));
                      columns.Bound(o => o.Active)
                      columns.Bound(o => o.LockedAccount)
                          .Title("Locked Account")
                      columns.Bound(o => o.LockoutDateTime)
                          .Title("Lockout Date Time")



  2. Answer
    Plamen avatar
    2723 posts

    Posted 17 Nov 2015 Link to this post


    Keyboard navigation within the Grid is supported by the navigatable option as it is described here. I am attaching a sample MVC project where it worked correctly at my side.

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  3. UI for ASP.NET AJAX banner
  4. Justin
    Justin avatar
    12 posts
    Member since:
    Feb 2015

    Posted 17 Nov 2015 in reply to Plamen Link to this post

    Looks like things are working! Thank you!
Back to Top