I'm trying to display a tooltip when the user clicks on a grid cell. When I click on a cell, the tooltip appears. The problem is that after the click, it keeps popping up whenever I hover over any other cell. I am using Ext JS 4.2.1. I'll leave below the code of how I'm handling the cellclick event in the controller and how I'm creating the tooltip.
onCellClick: function (view, td, cellIndex, record, tr, rowIndex, e, eOpts) {
var store = Ext.getStore('pontoeletronico');
if (view.tip) {
view.tip.destroy();
view.tip = null;
}
if(cellIndex > 0 && cellIndex < 5) {
view.tip = Ext.create('Ext.tip.ToolTip', {
autoShow: false,
showDelay: 0,
stateful: false,
target: view.el,
width: 100,
title: 'Horário original',
delegate: view.cellSelector,
trackMouse: false,
autoHide: true,
listeners: {
beforeshow: function (tooltip, eOpts) {
var ponto = store.findRecord('id', record.get('idPonto'));
var horario;
if (cellIndex == 1) {
horario = ponto.get('entrada01');
} else if (cellIndex = 2) {
horario = ponto.get('saida01');
} else if (cellIndex == 3) {
horario = ponto.get('entrada02');
} else if (cellIndex == 4) {
horario = ponto.get('saida02');
}
horario = horario != null ? Ext.Date.format(horario, 'H:i:s') : "--:--:--";
//tooltip.update(horario);
tooltip.html = horario;
}
}
});
}
}