Kendo ui 在剑道网格中单击鼠标右键获取选定行

Kendo ui 在剑道网格中单击鼠标右键获取选定行,kendo-ui,kendo-grid,Kendo Ui,Kendo Grid,我有一个剑道网格,我想检测右击和左击,所以基于这些,我做了两件不同的事情。我以前通过左键或右键单击从网格中获取ID,工作正常。但是为了解决IE11的点击问题,我必须将kendo.js更新到2013.2.716版本,之后它检测到左/右点击OK right But for right click无法获取所选行Id。以下是我检测左/右点击的代码,PlodId是我网格中的一列: function LoadMainShiftGrid() { //For Right Click --> Delete

我有一个剑道网格,我想检测右击和左击,所以基于这些,我做了两件不同的事情。我以前通过左键或右键单击从网格中获取ID,工作正常。但是为了解决IE11的点击问题,我必须将kendo.js更新到2013.2.716版本,之后它检测到左/右点击OK right But for right click无法获取所选行Id。以下是我检测左/右点击的代码,PlodId是我网格中的一列:

function LoadMainShiftGrid() {

//For Right Click --> Delete Selected Shift

$("#shiftReport").delegate("tbody>tr", "contextmenu", function (e) {
    if (e.which == 3) {
        $("#plodDetails").hide();            
        var gridData = $('#shiftReport').data("kendoGrid");
        var selectedRowData = gridData.dataItem($('.k-grid').find("tr.k-state-selected"));

    // MY PROBLEM FOR RIGHT CLICK SELECTEDROWDATA COMES TO NULL <<<<

        var SelectedPlodId = selectedRowData.PlodId;                        
    }
});

//For Left Click --> Show Plod Detials

$("#shiftReport").delegate("tbody>tr", "click", function (e) {
    if (e.which == 1) {
        var gridData = $('#shiftReport').data("kendoGrid");
        var selectedRowData = gridData.dataItem($('.k-grid').find("tr.k-state-selected"));
        var SelectedPlodId = selectedRowData.PlodId;           
    }
});
}

提前谢谢。

我认为会发生这种情况,因为右键单击实际上并没有选择行。 您可以通过代码选择它,然后再尝试通过

var selectedRowData = gridData.dataItem($('.k-grid').find("tr.k-state-selected"));
您应该能够通过事件对象获得单击目标,并通过剑道在其上设置所选属性

var index = gridData.find(e.delegateTarget).index(); 
var dataItem = gridData.dataSource.view()[index]; 
dataItem.selected(); 

您可能需要将true传递给所选函数。

我已将单击绑定函数更改为“mousedown”,并手动选择行。谢谢@drw85的建议,之后它就可以正常工作了

function LoadMainShiftGrid() {

$('#shiftReport').data('kendoGrid').tbody.on('mousedown', function (e) {

    //select the clicked row manually; this resolves all problem :D
    $('#shiftReport').data("kendoGrid").select(e.target.parentElement);

   if (e.which == 3) {
        $("#plodDetails").hide();            
        var gridData = $('#shiftReport').data("kendoGrid");
        var selectedRowData = gridData.dataItem($('.k-grid').find("tr.k-state-selected"));    
        var SelectedPlodId = selectedRowData.PlodId;                        
    }

    //For Left Click --> Show Plod Details    
    if (e.which == 1) {
        var gridData = $('#shiftReport').data("kendoGrid");
        var selectedRowData = gridData.dataItem($('.k-grid').find("tr.k-state-selected"));
        var SelectedPlodId = selectedRowData.PlodId;           
    }
});
}

Use.Selective将在您将鼠标悬停在行上并单击任何特定行时亮起该行,示例代码:

    @(Html.Kendo().Grid(Model)
          .Name("Grid")
          .DataSource(datasource => datasource
              .Ajax()
              .ServerOperation(false)
              .PageSize(15)
              )
            .Sortable()
            .Columns(columns =>
            {
                columns.Bound(model => model.NetworkID);
                columns.Bound(model => model.FirstName);
                columns.Bound(model => model.LastName);
            })
            .Filterable()
            .Scrollable(s => s.Height(550))
            .Pageable()
            .Resizable(resize => resize.Columns(true))
            .Selectable()
    )

您也可以像这样获取所选行

$("#shiftReport").on("mousedown", "tr[role='row']", function (e) {
    if (e.which === 3) {
        $(this).addClass("k-state-selected");
         var gview= $('#shiftReport').data("kendoGrid");
        var selectedRow = gview.dataItem($(this));
      }
});

在IE 11中,这将起作用

$("#grid").kendoGrid({
change: function(e) {
var selected = this.select();
var selectedDataItems = [];
for (var i = 0; i < selected.length; i++) {
  var dataItem = this.dataItem($(selected[i]).closest("tr"));
  selectedDataItems.push(dataItem);
}
}
});

如果您可以提供一个带有示例的JSFIDLE,我将再看一看。。谢谢你的帮助。。它在js中不起作用,它说,没有方法“查找”。。但根据你的想法,我想出了解决方案。好吧,用这个解决方案编辑你的问题,这样其他人可以从中学习;我可以知道什么是shiftReport吗?@UserA1195这是一个HTML id,你将在这里连接剑道网格。