使用 Dojo DataGrid 和 JSonRestStore 显示 dijit 工具提示答案

【问题标题】：Display dijit toolTip with Dojo DataGrid and JSonRestStore使用 Dojo DataGrid 和 JSonRestStore 显示 dijit 工具提示
【发布时间】：2013-04-25 15:23:35
【问题描述】：

当单元格悬停时，是否有更有效的方法来显示工具提示？使用结构属性来格式化数据网格，有没有办法使用格式化程序来显示dijit toolTip，而不是使用html标题属性。

这是显示工具提示的列。

    var subscriberGridLayout = [        
       {    
            name: " ",
            field: "ExpirationDate",
            formatter: function(value){
                if(value){
                    expDate = formatDateIE(value);
                    return toolTip();
                }
                else
                    return " ";
            },
            styles: "text-align: center;",
            width: "30px"
        },

这是通过图像标签显示工具提示图标的函数，但它不是使用 dijit 工具提示，而是简单地使用 html 的标题来显示弹出窗口。

    function toolTip(){
        src = "'/Subscriber/resources/images/icons/icon_error.gif'/>";
        if(dojo.date.difference(today, expDate) <= 0 ){
            message = "Credential expired.";
            return "<img title='"+ message + "' src=" + src + "";
        } else if(dojo.date.difference(today, expDate) <= 60) {
            message = "This Subscriber will expire in " + dojo.date.difference(today, expDate) + " days."
                        + "&#10; &#10;To prevent an interruption in the Subscriber&rsquo;s access, please sumbit a request to " + 
                            "renew the Subscriber within 30 days of the expiration date.";
            return "<img title='"+ message + "' src=" + src + "";
        } else {
            return " ";
        }

    }

【问题讨论】：

标签： tooltip dojo dojox.grid.datagrid dojox.grid

【解决方案1】：

我会这样做：

new Tooltip({
    connectId: grid.domNode,
    selector: "td",
    getContent: function(matchedNode){
        return matchedNode.innerText
    }
});

使用grid.domNode，您可以获得小部件的生成DOM。网格生成表格结构，因此您可以使用 selector 和 getContent 属性获取单元格。

我必须说这不是真正正确的方法，因为现在您正在使用 Dojo 小部件的内部结构。如果他们曾经决定不使用表格作为 DOM 结构，那么您的代码将无法工作。

但我认为没有更好的方法来实现这一点，最终您将始终必须将 Dojo 单元转换为 DOM 节点（因为工具提示是基于 DOM 的）。您当然可以将工具提示连接到每个单元格，但我之前尝试过，但它有点错误（有时工具提示没有弹出）。

我还创建了一个JSFiddle 来向您展示一个工作示例。

【讨论】：