how to get selected row value in the KendoUI

grid, kendo-ui

Solution

One way is to use the Grid's `select()` and `dataItem()` methods.

In single selection case, `select()` will return a single row which can be passed to `dataItem()`

var entityGrid = $("#EntitesGrid").data("kendoGrid");
var selectedItem = entityGrid.dataItem(entityGrid.select());
// selectedItem has EntityVersionId and the rest of your model

For multiple row selection `select()` will return an array of rows. You can then iterate through the array and the individual rows can be passed into the grid's `dataItem()`.

var entityGrid = $("#EntitesGrid").data("kendoGrid");
var rows = entityGrid.select();
rows.each(function(index, row) {
  var selectedItem = entityGrid.dataItem(row);
  // selectedItem has EntityVersionId and the rest of your model
});

Problem

I have a kendoUI grid. ``` @(Html.Kendo().Grid<EntityVM>() .Name("EntitesGrid") .HtmlAttributes(new { style = "height:750px;width:100%;scrollbar-face-color: #eff7fc;" }) .Columns(columns => { columns.Bound(e => e.Id).Hidden().IncludeInMenu(false); columns.Bound(e => e.EntityVersionId).Hidden().IncludeInMenu(false); columns.Bound(e => e.Name).Width("70%").Title("Entity Name"); columns.Bound(e => e.EIN).Width("30%"); }) .ToolBar(toolBar => toolBar.Template("<a class='k-button k-button-icontext k-grid-add' id='addEntity'><span class='k-icon k-add'></span>Entity</a>" + "<a class='k-button k-button-icontext' id='editEntity'><span class='k-icon k-edit'></span>Edit</a>")) .DataSource(dataSource => dataSource .Ajax().ServerOperation(false) .Model(model => model.Id(e => e.Id)) .Read(read => read.Action("GetEntities", "Entity", new { projectId = Request.QueryString[DataKeyNameConstants.ProjectId] }))) .Sortable() .Scrollable() .Filterable() .Resizable(resize => resize.Columns(true)) .Reorderable(reorder => reorder.Columns(true)) .ColumnMenu() .Selectable(s => s.Mode(GridSelectionMode.Multiple)) .Events(events => events.Change("entSelChange")) ) ``` now, I need to get the value of EntityVersionId from the selected Row. but not sure how to do it. here's my javascript function ``` $("#editEntity").click(function () { var entityGrid = $("#EntitesGrid").data("kendoGrid"); // what should I do from here }); ``` UPDATE: add code to loop all rows. ``` function loadPreviousEntityVersion() { alert("sdfsdfsdf"); var entityGrid = $("#EntitesGrid").data("kendoGrid"); var data = entityGrid.dataSource.data(); for(var i = 0; i<data.length; i++) { var currentDataItem = data[i]; alert(dataItem.EntityVersionId); } } ```

Original source