Kendo grid - get current editing row

Question

How do you get the current row that's been edited even when it's not selected? I have a batch enabled Kendo grid that is navigatable. My goal is to manually edit data in a column using the dataItem.set() method. However, when you add a row it does not get selected automatically. Hence, vm.testGrid.dataItem(vm.testGrid.select()) cannot be used.

vm.testGrid.dataSource.get(e.model.get("Id")) gets the newly added row, but if multiple rows were added before saving, it will always get the first added row ("Id" is set to auto increment and is automatically generated by the database server, therefore all newly created rows will initially have 0 before saving).

vm.onEdit = function (e) {
    $('input.k-input.k-textbox').blur(function (f) {
        //var data = vm.testGrid.dataItem(vm.testGrid.select());
        var data = vm.testGrid.dataSource.get(e.model.get("Id")); // will always get the firstly added row
        data.set("LookupCol", "1000");
    }
});

Is there a better solution to get the row that's been currently edited? Or is there a better way to edit the current row?

Veolaver

Answer 1

The following will give you the data item associated with the current cell:

var dataItem = grid.dataItem(grid.current().closest("tr"));

// You can then set properties as you want.
dataItem.set("field1", "foo");
dataItem.set("field2", "bar");

Amongst

Great, I have problems finding current edited row while filtering data in transport read (cannot get UI reference from parameter at all) this one fix my problem – Spicy

after testing, found out problem with this approach: when first grid appears, then press add -> modify input template, grid.current() is undefined. – Spicy

Answer 2

I used the JQuery closest() function:

vm.onEdit = function (e) {
    $('input.k-input.k-textbox').blur(function (f) {
        var data = vm.testGrid.dataItem($(e.container).closest("tr"));
        data.set("LookupCol", "1000");
    }
});

Veolaver

Answer 3

You can also write an extension for the grid, e.g. like this

// extend the grid
kendo.ui.Grid.fn.getCurrentDataItem = function() {
  var that = this, current = that.current(), dataItem = null;        
  if (current) {
    dataItem = that.dataItem(current.closest('tr'));
  }        
  return dataItem;
}

JSFiddle example

Dogear