ExtJs 向网格单元格文本添加工具提示

Question

我正在使用 Extjs 创建 UI。所以我创建了带有列的网格。我的任务是向某些单元格添加工具提示，但仅限于部分文本。我尝试使用 meta.tdAttr = 'data-qtip="Activity is in use"'; 看起来行得通，但是当我只想要某些文本时，会在整个单元格上设置工具提示。

这是我的实现：

                        {
                            hideable : false,
                            width : 200,
                            flex : 1,
                            dataIndex : 'name',
                            text : 'Name',
                            renderer :  function(value, meta, record) {
                                meta.tdCls += ' '
                                        + this.getValidation()
                                                .getHighestLevelCls(
                                                        record.modelType,
                                                        record.id);
                                var inUseClass = '';
                                if (record.get('descendants').length > 0) {
                                    meta.tdAttr = 'data-qtip="Activity is in use"'; // here is tool tip setter
                                    inUseClass = Glyphs
                                            .getIconClass('dot-circle-o');
                                } else {
                                    inUseClass = Glyphs
                                            .getIconClass('circle-o');
                                }
                                return Glyphs.wrapClass(inUseClass,
                                        'font-size:10; color:black;',
                                        '&nbsp;&nbsp;')
                                        + value;
                            }
                        }

正如您在单元格中看到的那样，我打印了 Glyph（它是某种解释为文本的图标，取自 AwesomeFonts.com）+ 值（文本值），所以我需要在悬停时显示工具提示只有鼠标 Glyth。也许有人可以建议我任何解决方案？

Answer 1

您可以尝试从渲染器返回 <span>，而不是将所有属性应用于它：

renderer: function(value) {
    return '<span data-qtitle="QTip Example" data-qwidth="200" '+
           'data-qtip="This is a quick tip from a custom renderer!">'+
            value+'</span>';
}},

一个fiddlehere。（我尝试使用普通文本，但概念相似）

ExtJs 向网格单元格文本添加工具提示

ExtJs add tool tip to grid cell text

javascript

extjs

tooltip