tooltip - Extjs4在gridPanel中每列悬停设置工具提示

Question

我在当前列的每一行都获得了鼠标悬停的工具提示，但我无法在继续悬停在同一行时获得下一列工具提示。

但是如果我将鼠标悬停在另一行上并再次悬停前一行的任何列，我可以得到它：

listeners:{
'itemmouseenter': function (view, record, item, index, e, eOpts) {
        var gridColums = view.getGridColumns();
        var column = gridColums[e.getTarget(this.view.cellSelector).cellIndex];
        Ext.fly(item).set({ 'data-qtip': 'Des:' + column.dataIndex });

  }
}

谁能告诉我我错过了什么或指出我正确的方向？

Answer 1

我有一个简单的，使用渲染器功能：

{
    xtype : 'gridcolumn',
    dataIndex : 'status',
    text : 'Status',
    renderer : function(value, metadata) {
                    metadata.tdAttr = 'data-qtip="' + value + '"';
                    return value;
                }
}

Answer 2

我正在看这个。我可以通过执行以下操作来获取每个单元格的工具提示：

 Ext.getCmp('DynamicDemandGrid').getView().on('render', function(view) {
    view.tip = Ext.create('Ext.tip.ToolTip', {
        // The overall target element.
        target: view.el,
        // Each grid row causes its own seperate show and hide.
        delegate: view.cellSelector,
        // Moving within the row should not hide the tip.
        trackMouse: true,
        // Render immediately so that tip.body can be referenced prior to the first show.
        renderTo: Ext.getBody(),
        listeners: {
            // Change content dynamically depending on which element triggered the show.
            beforeshow: function updateTipBody(tip) {
                var gridColums = view.getGridColumns();
                var column = gridColums[tip.triggerElement.cellIndex];
                var val=view.getRecord(tip.triggerElement.parentNode).get(column.dataIndex);
                tip.update(val);
            }
        }
    });
});

让我知道它是否有帮助

Answer 3

{
    text: name,
    width: 80,
    dataIndex: dataIndex,
    sortable: true,
    listeners: {
        afterrender: function ()
        {
            Ext.create('Ext.ToolTip',
            {
                target: this.getEl(),
                anchor: direction | "top",
                trackMouse: true,
                html: this.text
            });
        }
    }
}