ExtJS --将工具提示添加到网格列标题

kulphzqa 于 2022-11-04 发布在其他

关注(0)|答案(2)|浏览(198)

我正在使用ExtJS 5。我有一个动态网格，这意味着列配置、存储字段、数据等都来自后端。
在用列重新配置网格之前，我尝试使用data-qtip属性在标题中添加工具提示，但没有效果。
这是小提琴：https://fiddle.sencha.com/#fiddle/1fr8
片段：

var cols = data_1.metaData.columns;
for(var i=0;i<cols.length;i++){
   cols[i].header = "<font data-qtip='"+cols[i].header+"'>"+cols[i].header+"</font>";
}
grid.reconfigure(null, cols);       
store.getProxy().data =data_1.data;
store.loadPage(1)
grid.getView().refresh();

谢谢你！

extjs

来源：https://stackoverflow.com/questions/39401077/extjs-add-tooltip-to-grid-column-header

2条答案

按热度按时间

u3r8eeie1#

请不要过于复杂的事情，网格列有一个tooltip的配置，这应该工作。

for(var i=0;i<cols.length;i++){
      cols[i].tooltip = cols[i].header;
  }

它在您的示例中不起作用，因为QuickTipManager必须首先在Ext.onReady中初始化：

Ext.onReady(function(){
    Ext.tip.QuickTipManager.init();
    var store = ...

请注意，gridcolumn中的header配置已被弃用，取而代之的是text配置。

赞(0）回复(0）举报 2022-11-04

hivapdat2#

您也可以覆写initRenderData，在整个应用程序中设定这个值。例如，永远使用栏文字做为工具提示：

/**
     * If a tooltip has not been set for a column header
     * then always default to the column name
   **/
    Ext.override(Ext.grid.column.Column, {
        initRenderData: function () {
            var me = this;
            if (Ext.isEmpty(me.tooltip)) {
                me.tooltip = me.text;
            }
            return me.callParent(arguments);
        }
    });

展开查看全部

赞(0）回复(0）举报 2022-11-04

我来回答

ExtJS --将工具提示添加到网格列标题

2条答案

相关问题

热门标签

最新问答