Events
You can subscribe to all Grid events and then use them to further customize the behavior of the Grid.
The example below demonstrates how to use the Change event that the Grid generates when the user selects a table row or a cell.
@(Html.Kendo().Grid<Kendo.Mvc.Examples.Models.CustomerViewModel>()
.Name("grid")
.Columns(columns =>
{
columns.Bound(c => c.ContactName).Title("Contact Name").Width(240).Filterable(ftb => ftb.Multi(true));
columns.Bound(c => c.ContactTitle).Title("Contact Title");
columns.Bound(c => c.CompanyName).Title("Company Name");
columns.Bound(c => c.Country).Title("Country").Width(150);
})
.Groupable()
.Selectable()
.Events(events => events
.Change("onChange")
)
.Sortable()
.Pageable(pageable => pageable
.Refresh(true)
.PageSizes(true)
.ButtonCount(5))
.DataSource(dataSource => dataSource
.Ajax()
.Read(read => read.Action("Orders_Read", "Grid"))
.PageSize(20)
)
)
<script>
function onChange(e) {
var selectedRow = this.select();
var dataItem = this.dataItem(selectedRow);
console.log(dataItem)
}
</script>