как получить Кендо выбора строк сетки

Question

Как включить кендо щий выбор сетки строки иЕ создал кендо сетку с помощью HTML вспомогательной функции доступа к нему с помощью Javascript и включена строка выделенного, но не код удачи не будет показан ниже

@(Html.Kendo().Grid((IEnumerable<Gridkendo.Models.Model>)Model) 
    .Name("grid") 
    .Columns(columns => 
    { 
     // Create a column bound to the ProductID property 
     columns.Bound(product => product.Name); 
     // Create a column bound to the ProductName property 
     columns.Bound(product => product.Description); 

и доступ к нему в JavaScript

<script> 
    $(function() { 
     // Notice that the Name() of the grid is used to get its client-side instance 
     var grid = $("#grid").data("kendoGrid"); 
     var selectedItem = grid.dataItem(grid.select()); 
     alert(selectedItem.ShipName); 
    }); 
</script> 

Answer 1

Вам нужно добавить метод Selectable() конфигурации. Это позволит выбор строки по умолчанию,

@(Html.Kendo().Grid((IEnumerable<Gridkendo.Models.Model>)Model) 
    .Name("grid") 
    .Columns(columns => 
    { 
     // Create a column bound to the ProductID property 
     columns.Bound(product => product.Name); 
     // Create a column bound to the ProductName property 
     columns.Bound(product => product.Description); 
    }) 
    .Selectable() 
) 

Примечание что вы получаете выбранный элемент в document ready случае. Это означает, что сетка только что была инициализирована, и маловероятно, чтобы была выбрана любая строка. Лучший подход заключается в использовании «выбрать» событие, конфигурируемый в помощнике:

@(Html.Kendo().Grid((IEnumerable<Gridkendo.Models.Model>)Model) 
    .Name("grid") 
    .Columns(columns => 
    { 
     // Create a column bound to the ProductID property 
     columns.Bound(product => product.Name); 
     // Create a column bound to the ProductName property 
     columns.Bound(product => product.Description); 
    }) 
    .Selectable() 
    .Events(ev => ev.Change("doOnRowSelect")) 
) 

Затем нужно определить doOnRowSelect JavaScript функция:

function doOnRowSelect(e) { 
    var selectedItem = this.dataItem(this.select()); 
    alert(selectedItem.ShipName); 
} 

EDIT: метод выше (в по крайней мере, часть JavaScript) работает только тогда, когда данные загружаются через AJAX. Однако выбор строки должен также работать, когда данные загружаются из Model. В этой помощи, выбранная строка будет иметь k-state-selected класс:

function getSelectedItem() { 
    var grid = $("#grid").data("kendoGrid"); 
    var selectedRows = $(".k-state-selected", "#grid"); 
    if (selectedRows.length > 0) { 
     var selectedItem = grid.dataItem(selectedRows[0]); 
     alert(selectedItem.ShipName); 
    } 
}