Kendo grid checkbox get last selected value

0
votes

I have kendo grid with a select option. My question is how do I get ProductName from the last selected row? Example like this. I have tried with this but row is null. Appreciate your help.

FULL DEMO IN DOJO

function onChange(e) {
    var rows = e.sender.select();
    rows.each(function(e) {
        var grid = $("#grid").data("kendoGrid");
        var row = $(e.target).closest("tr"); //<-- this value capture null
        var dataItem = grid.dataItem(row);
        var productName = dataItem.ProductName;
        alert(productName);
   })
};
2
kendo-uikendo-grid

2 Answers

2
votes

You have incorrect parameters in the function in each.

This causes name masking: https://en.wikipedia.org/wiki/Name_resolution_(programming_languages)#Name_masking

At the outer level, you have:

function onChange(e) {

Then, in the third line, you have:

 rows.each(function(e) {

That's two functions of e. So which e counts? The inner one masks the outer one.

The correct arguments for the inner function are:

rows.each(function(index, row) {

Now, you're already iterating over rows, so you have the row, you don't need to look for it with any closest().

You also have the grid, it's e.sender, because you're in a grid event.

That gives you the following code:

function onChange(e) {
    var rows = e.sender.select();
    rows.each(function(index, row) {
        console.log(row);
        var dataItem = e.sender.dataItem(row);
        console.log(dataItem);
        var productName = dataItem.ProductName;
        console.log(productName);
   })           
};

Demo

In the future, be wary of the difference between Kendo events and jQuery events.

2
votes

Just use grid.select() inside grids change function:

function onChange(e) {
  var grid = $("#grid").data("kendoGrid");
  var selectedItem = grid.dataItem(grid.select());
  console.log(selectedItem.ProductName)
};

Example: Get last selected item