Kendo UI网格选择

Question

我有一个驱动程序表：

Index.cshtml

@model IEnumerable<Dal.Driver>

    @(Html.Kendo().Grid(Model)
      .Name("OrdersGrid")
      .Columns(columns =>
      {
          columns.Bound(o => o.Name);
          columns.Bound(o => o.FamilyName);
          columns.Bound(o => o.Licence);
          columns.Bound(o => o.ExperienceYears);
      })
      .DataSource(dataSource => dataSource
        .Ajax()
        .Model(model => model.Id(o => o.Id)))
      .Selectable(select => select.Enabled(true))
      .Events(e => e.Change())
      .Pageable()
      .Sortable()
      .Filterable()
      .Groupable()
    )

当客户端选择驱动程序时，我想添加一个可以导航到其他页面的乘法按钮。

我该怎么做？

Answer 1

下面的代码用于启用网格选择。 有不同的模式，例如“多”，“单”和“类型”（如“单元格”等）

@(Html.Kendo().Grid<Model>()
    .Name("OrdersGrid")
    .Columns(columns => {
        columns.Bound(o => o.ShipCountry).Width(200);
    })
    .Pageable(pageable => pageable.ButtonCount(5))
    .Selectable(selectable => selectable
        .Mode(GridSelectionMode.Multiple))
    .Navigatable()
    .DataSource(dataSource => dataSource
        .Ajax()
        .PageSize(5)
        .Read(read => read.Action("Orders_Read", "Grid"))
     )
);

下面的代码提供了Select Event，您将在其中获取所选列或行名称以及索引的详细信息

$(OrdersGrid.tbody).on("click", "td", function (e) {
var row = $(this).closest("tr");
var rowIdx = $("tr", OrdersGrid.tbody).index(row);
var colIdx = $("td", row).index(this);
var colName = $('#OrdersGrid').find('th').eq(colIdx).text()
alert("Selected cell on row: " + rowIdx + " and column name: " + colName);
});