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

私はこれを見ていました。私はこのような何かを行うことによって、各セルのツールヒントを得るために管理することができます：

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 2

を助け場合、私はレンダラー機能を使用して、簡単なものを持って知ってみましょう：

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

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 
      }); 
     } 
    } 
}