在不清除所选行的情况下清除Kendo Grid Detail Template中的选择

时间:2013-11-01 11:38:32

标签: asp.net-mvc asp.net-mvc-4 razor kendo-ui kendo-grid

我有一个带有详细模板的Kendo Grid,一个网格内的网格,我希望每次只选择一行。例如,如果选择了一行并展开它,显示内部网格,那么我从内部网格中选择一行,外部网格中的行始终保持选中状态。现在我在网格中有两个选定的行,一个在外部网格(主行)中选择,另一个在内部网格中选择。

我可以抓住一些模仿某种“OnLeave”事件的事件吗?

我一直在浏览Kendo文档,我唯一能想到的就是尝试在Change-event中抓取一些东西。但是我还没有找到如何清除两个网格中的所有选择而不清除我最后点击的所选行(在内部或外部网格中)。

无论如何,对于这个愚蠢的事情,任何帮助都很清楚:)

我的观点

    @(Html.Kendo().Grid<SomeModel>()
  .Name("SomeGrid")
  .Columns(c =>
      {
          // some columns (abbreviated)
      })
  .Selectable(s => s.Enabled(true).Mode(GridSelectionMode.Single).Type(GridSelectionType.Row))
  .ClientDetailTemplateId("someTemp")
  .Events(events => events.DataBound("dataBound").Change("onSomeGridChange"))
  .DataSource(d => d.Ajax().Model(model => model.Id(p => p.SomeId)))
  )  

<script id="someTemp" type="text/kendo-tmpl">
@(Html.Kendo().Grid<SomeObject>()
  .Name("grid_#=SomeId#")
  .Columns(c =>
      {
          // some columns (abbreviated)
      })
  .Selectable(s => s.Enabled(true).Mode(GridSelectionMode.Single).Type(GridSelectionType.Row))
  .Events(events => events.Change("onSomeGridChange"))
  .DataSource(dataSource => dataSource
                                .Ajax()
                                .Read(read => read.Action("GetSomeData", "Controller", new { blNumber = "#=SomeId#" })))
  .ToClientTemplate()
  ) 

然后是我的剧本:

function onDerpChange(e) {
e.preventDefault();

var fff = e.sender;

// How could I clearselection on all other rows than the one I selected last?

var selectedRows = this.select();
var selectedDataItems = [];
for (var j = 0; j < selectedRows.length; j++) {
    var ddataItem = this.dataItem(selectedRows[j]);
    selectedDataItems.push(ddataItem);
}
}

1 个答案:

答案 0 :(得分:4)

您可以对所有这些网格(外部和内部网格)使用附加“选择”事件处理程序,以清除所有其他选定行的单个事件。

事件处理程序应如下所示:

function onRowSelect(){
     var currentlySelected = this.select();
     $('.k-grid tbody>.k-state-selected').not(currentlySelected).removeClass('k-state-selected')
}