Как сделать tooltip для ячейки таблицы?

[khusamov]

Как сделать tooltip для ячейки таблицы?

В коде класса таблицы события mouseover и mouseout заблокированы:

if (cell && type !== 'mouseover' && type !== 'mouseout') {

http://docs.sencha.com/extjs/6.2.0/c...Ext.view.Table

И как теперь быть?

[siber-biber]

http://docs.sencha.com/extjs/6.2.1/c...ipManager.html
http://docs.sencha.com/extjs/6.2.1/c...l#cfg-renderer

var myRenderer = function(value, metaData, record, rowIndex, colIndex) {
    if (colIndex === 0) {
        metaData.tdAttr = 'data-qtip=' + value;
    }
    // additional logic to apply to values in all columns
    return value;
}

// using the same renderer on all columns you can process the value for
// each column with the same logic and only set a tooltip on the first column
renderer: myRenderer

[khusamov]

А полноценный? чтобы внутри были полноценные компоненты, а не статичный HTML

[Infarch]

Начало почти такое же. Делаете рендерер:

xtest: function(value, metaData, record, rowIndex, colIndex){
		metaData.tdCls = 'abyrvalg';
		return value;
	},

и инициализируете тултип:

var grid = me.getView();
var el = grid.getEl();

Ext.widget('your-cool-widget', {
	gridView: view,
	target: el,
	delegate: 'td.abyrvalg',
	width: 600,
	height: 500,
	trackMouse: true,
	dismissDelay: 0,
	autoHide: true,
	renderTo: Ext.getBody()
});

Ну а виджет наследуете от тултипа и там творите что хотите.

[Infarch]

Кстати, модель в тултипе получаем так:

Ext.define('ContentPanel.view.workspace.popup.Metadata', {
	extend: 'Ext.tip.ToolTip',
	alias: 'widget.workspace-popup-metadata',
	
	config: {
		gridView: null
	},
	
	beforeShow: function(){
		var
			record = this.getGridView().getRecord(this.triggerElement);
		
	}
	
});

[khusamov]

Решение любопытное тем, что не совсем очевидные вещи вы используете.
Например опция delegate.

Также не очевидный трюк target: grid.getEl()

Но решение на первый взгляд отличное.
Я так понимаю экземпляр тултипа ОДИН, и он один вызывается для каждой ячейки, то есть память не забивается кучей тултипов (для каждой ячейки свой). И модель под рукой у тултипе.

Осталось понять, как такой тултип организовать внутри конфига колонки, чтобы декларативный способ подключения тултипа тоже работал. Но это я сам придумаю и тут выложу.

Мне сначала надо поразмышлять над delegate и target: grid.getEl(). Эти трюки для меня не очевидны пока.

[Infarch]

Еще строчку забыл: view = grid.getView()

[khusamov]

Как дополнение к вопросу нашел вот эту ветку форума https://www.sencha.com/forum/showthread.php?259937
А также на стековерфлоу http://stackoverflow.com/questions/4...42936_43316686