如何在 extjs actioncolumn 图标上添加动态工具提示？

Posted 2023-02-26

【中文标题】如何在 extjs actioncolumn 图标上添加动态工具提示？

【英文标题】：How to add dynamic tooltip on extjs actioncolumn icons?

【发布时间】：2012-11-30 08:23:47

【问题描述】：

我有类似这样的 actioncolumn：

    xtype: 'actioncolumn',
    align: 'center',
    items: [
        
            getTip: function () 
                return 'this doesn\'t work';
            ,
            handler: function() 
                // action 1
            
        ,
            tooltip: 'works',
            handler: function() 
                // action 2
            
        
    ]

getTip() 方法我在文档中找到，但它不起作用或者我不知道如何使用它。我做错了什么或如何设置工具提示？

【问题讨论】：

ExtJS 4.2 修复了这个问题

【参考方案1】：

就像 bjornd 所说的那样，getTip() 似乎是错误，但我成功添加了工具提示，这不是我认为的最佳方式，但它对我有用。

    xtype: 'actioncolumn',
    align: 'center',
    items: [
        
            getClass: function(value,meta,record,rowIx,colIx, store) 
                this.items[0].tooltip = 'working ' + record('name');
                return 'some-class-name'; // or something if needed
            ,
            handler: function() 
                // action 1
            
        ,
            tooltip: 'works',
            handler: function() 
                // action 2
            
        
    ]

如果有人能提出更好的解决方案，我会很高兴听到。

【讨论】：

确保您在操作列上没有工具提示配置，否则不会调用 getTip。在 Ext 6 中，只要没有工具提示配置，它就可以工作。

【参考方案2】：

我用过

getTip : function(value, metaData, record)
    return this.getCheckOutCheckInToolTip(record);
,

有效

【参考方案3】：

如 items 属性的 cmets 所述：

getTip 选项似乎不起作用。我已经声明了一个函数：

getTip:function( value, metadata, record ) 
    if( !record.get( 'editable' ) )
        return 'Record is locked';
    return 'Delete record';

鼠标悬停时没有提示出现。 Firebug 中的结果代码是：

<td class=" x-grid-cell x-grid-cell-btn-timesheet-delete   x-action-col-cell x-grid-cell-last"><div style="text-align: left; ;" class="x-grid-cell-inner "><img class="x-action-col-icon x-action-col-0   timesheet-option-icon-delete" src="data:image/gif;base64,R0lGODlhAQABAID/AMDAwAAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" ></div></td>

所以，没有 data-qtip 属性。

所以我认为这是一个已知问题。您可以等待更新或通过一些覆盖自行修复它。

【讨论】：

但也许还有其他方法可以添加工具提示。如果存在这种方法，一定有人在这样做。