代码之家 › 专栏 › 技术社区 › Cody Pritchard

剑道网格-悬停时获取单元格索引

kendo-tooltip kendo-grid kendo-ui jquery

0

Cody Pritchard · 技术社区 · 7 年前

我正在尝试将kendoToolTip添加到网格上特定列的单元格中。现在,工具提示可以工作,但是当鼠标悬停在网格上的任何单元格上时,它会显示出来。

我想获得im悬停在上面的项目的特定单元格索引,以便仅在悬停在单元格索引9上时显示工具提示。

我的代码总是返回-1的单元格索引。我可以让它与onclick事件一起工作,但是我不能让它在悬停时工作。

任何帮助都将不胜感激。

    $("#samplerequest-grid").kendoTooltip({
        filter: "td",
        content: function(e) {
            var grid = $("#samplerequest-grid").data("kendoGrid");
            var dataItem = grid.dataItem(e.target.closest('tr'));
            var rowIdx = $("tr", grid.tbody).index(dataItem);
            var colIdx = $("td", dataItem).index(this); // Always returns -1

            console.log("row:" + rowIdx + " col:" + colIdx + " msg: " + dataItem.sampleStatusMsg);
            return dataItem.sampleStatusMsg;
        }
    });

更新:

谢谢你的回答。它们都会起作用,我可能会改变我的解决方案来使用它们。在看到你的答案之前,我找到了我自己的解决方案,那就是在单元格中添加一个模板并过滤该id。

网格列声明:

{
   field: "sampleStatus",
   title: "Sample Status",
   width: "110px",
   locked: true,
   lockable: true,
   template: "<span id='sampStatus'>#=getValue(sampleStatus)#</span>"
},

工具提示的控制器功能

$("#samplerequest-grid").kendoTooltip({
   filter: "#sampStatus",
   content: function(e) {
      var grid = $("#samplerequest-grid").data("kendoGrid");
      var dataItem = grid.dataItem(e.target.closest('tr'));
      return dataItem.sampleStatusMsg;
   }
});

2 回复 | 直到 7 年前

1

0

DontVoteMeDown 7 年前

我觉得你把事情搞得太复杂了。可以使用以下命令获取索引:

e.target.index() 细胞指数;
e.target.closest('tr') 行索引。

你 content 事件应为:

content: function(e) {
    var grid = $("#samplerequest-grid").data("kendoGrid");
    var tr = e.target.closest('tr');
    var dataItem = grid.dataItem(tr);
    var rowIdx = tr.index();
    var colIdx = e.target.index();

    console.log("row:" + rowIdx + " col:" + colIdx + " msg: " + dataItem.sampleStatusMsg);
    return dataItem.sampleStatusMsg;
}

Demo

2

0

SiliconSoul 7 年前

查找索引的代码将不起作用,因为您正在dataItem的上下文中搜索td元素。另外,我不认为content函数的上下文是当前单元格。此代码应能找到索引:

var row = e.target.closest('tr');                  
var colIdx = $("td", row).index(e.target);

但是,更好的方法是将类添加到列单元格,将同一类添加到筛选器: https://dojo.telerik.com/@SiliconSoul/UbImUjOl