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

Command button navigation with arrow keys

3 Answers 154 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Kerry
Top achievements
Rank 1
Kerry asked on 04 Sep 2013, 04:29 PM
Is it possible to navigate command buttons on the grid with arrow keys?

http://jsbin.com/ocekUQI/1/edit?html,output

My user would like to be able to navigate the grid with the arrow keys including the command buttons

3 Answers, 1 is accepted

Sort by
0
beauXjames
Top achievements
Rank 2
answered on 04 Sep 2013, 04:48 PM
Sure...there's some default functionality for you here:
http://demos.kendoui.com/web/grid/navigation.html
0
Kerry
Top achievements
Rank 1
answered on 04 Sep 2013, 07:14 PM
I may not have communicated my question properly.  I am wanting to navigate between individual command buttons on a grid with the arrow keys.  For example, click on the link below:

http://jsbin.com/ocekUQI/1/edit?html,output

Click on the first name in the first row and then left arrow over to the command buttons.  My user would like to be able to move between the individual View, Edit, and Delete buttons with the arrow keys. 
0
beauXjames
Top achievements
Rank 2
answered on 05 Sep 2013, 03:33 PM
Once you have control of your cell, you should be able to play with your focus events...
Create a dataBound event ::
function onDataBound(e) {
     var grid = $("#grid").data("kendoGrid");
     $(grid.tbody).on("click", "td", function (e) {
          var row = $(this).closest("tr");
          var rowIdx = $("tr", grid.tbody).index(row);
          var colIdx = $("td", row).index(this);
          if(colIdx == 3) alert('I am on row ' + rowIdx)
     });
}
Then just refer to it in your settings ::
$("#grid").kendoGrid({
     ...,
     dataBound: onDataBound,
     ...
});
This will not only ensure these handlers are applied when the grid first loads, but every binding thereafter...good luck!
Tags
Grid
Asked by
Kerry
Top achievements
Rank 1
Answers by
beauXjames
Top achievements
Rank 2
Kerry
Top achievements
Rank 1
Share this question
or