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

Grid Cell Not Entering Edit Mode When Tabbing To Grid From An Input Field

3 Answers 192 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Michele
Top achievements
Rank 1
Michele asked on 10 May 2017, 03:55 PM

We have a header/detail accounting application with a data-entry form and an editable grid. When tabbing off of the form to the grid the first cell will not go into edit mode except with some workaround 'hack' code in the 'navigate' event (see below). The problem is the grid edit mode literally works differently when tabbing to the first cell of the grid from a form input field vs. clicking in the same cell. Clicking (rather than tabbing) into the first cell does put the cell into edit mode, but
clears the field contents. Here's the code

let grid = $("#" + target).kendoGrid({

dataSource: {
data: rows,
schema: {
model: {
fields: columnSetup.modelFields
}
}
},
edit: function (e) {
// This does not fire when tabbing to the grid. It will fire if a cell is clicked.
},
editable: {
mode: "incell",
createAt: 'bottom'
},
navigatable: true,
navigate: function (e) {
   // Attempted Workaround (hack) - This does put the first cell in edit mode, but only when tabbing
   // to the grid. However, clicking in the first cell does put the cell in edit mode, but clears the field value.
   if (e.sender['_rowVirtualIndex'] == 0 && e.element[0]['cellIndex'] == 0 && typeof (e.sender['_editContainer']) != 'object') {
      this.editCell(e.element[0])
   }
},
resizable: true,
reorderable: true,
scrollable: { virtual: true },
selectable: "row",
columns: columnSetup.columns,
dataBound: keyboardEventHandler,
}).data('kendoGrid');

3 Answers, 1 is accepted

Sort by
0
Michele
Top achievements
Rank 1
answered on 10 May 2017, 03:56 PM
Here's what happens if we leave out the 'navigate' workaround code. The cell receives focus, but does not go into edit mode.
0
Michele
Top achievements
Rank 1
answered on 11 May 2017, 12:52 PM

I was able to resolve this issue based on this post in StackOverflow:

https://stackoverflow.com/questions/43897630/kendo-grid-cell-not-entering-edit-mode-when-tabbing-to-grid-from-an-input-field

0
Stefan
Telerik team
answered on 12 May 2017, 09:55 AM
Hello Michele,

I'm glad to hear that the issue is resolved.

Thank you for sharing the solution with the Kendo UI team, this is highly appreciated.

Regards,
Stefan
Telerik by Progress
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data (charts) and form elements.
Tags
Grid
Asked by
Michele
Top achievements
Rank 1
Answers by
Michele
Top achievements
Rank 1
Stefan
Telerik team
Share this question
or