grid cell mouseover event with rowIndex and colIndex

[ttbgwt]

How can I listen to cell mouseover events within a grid and capture the rowIndex and colIndex of the cell that is being mouseovered? Thanks!

I did this in 3.4 prior...

        grid.on('mouseover', function (e, t) {
            var me = this;


            var rowIndex = me.getView().findRowIndex(t);
            var cellIndex = me.getView().findCellIndex(t);


            if (rowIndex !== false && cellIndex !== false) {
                var cell = me.getView().getCell(rowIndex, cellIndex);

[evant]

http://docs.sencha.com/ext-js/4-1/#!...itemmouseenter
http://docs.sencha.com/ext-js/4-1/#!...itemmouseleave

[ttbgwt]

But those events are for row listeners and not cell listeners?

[margozzi]

Did you ever get a better response?

[ukjbrown]

+1 for needing a solution...

Been searching the net for about an hour to try to solve this so far with no luck.

[zzhouag]

http://stackoverflow.com/questions/8...over-in-extjs4

this should work

[yoldasyilmaz]

var view = this;
this.gridItemMouseOver = function(gridView, el, eOpts) {
var cellIndex = el.cellIndex;
if (el.cellIndex == undefined && el.offsetParent != undefined&& el.offsetParent.cellIndex != undefined)
cellIndex = el.offsetParent.cellIndex;
if (cellIndex > 0) {
var hdEl = this.getView().getHeaderAtIndex(cellIndex);
if (hdEl != undefined) {
hdEl.addCls('x-column-header-over');
setTimeout(function () {
if (hdEl != undefined)
hdEl.removeCls('x-column-header-over');
}, 99999);
}
}
};

this.gridItemMouseOut= function(gridView, el, eOpts) {
var cellIndex = el.cellIndex;
if (el.cellIndex == undefined && el.offsetParent != undefined&& el.offsetParent.cellIndex != undefined)
cellIndex = el.offsetParent.cellIndex;
if (cellIndex > 0) {
var hdEl = this.getView().getHeaderAtIndex(cellIndex);
if (hdEl != undefined) {
setTimeout(function () {
if (hdEl != undefined)
hdEl.removeCls('x-column-header-over');
}, 500);
}
}
};

this.onGridRender= function () {
this.mon(this.body, {
cellclick: {fn: view.gridItemMouseOver, scope: this},
celldblclick: {fn: view.gridItemMouseOver, scope: this},
itemclick: {fn: view.gridItemMouseOver, scope: this},
itemmouseenter: {fn: view.gridItemMouseOver, scope: this},
itemmouseleave: {fn: view.gridItemMouseOut, scope: this},
mouseover: {fn: view.gridItemMouseOver, scope: this},
mouseout: {fn: view.gridItemMouseOut, scope: this},
containerclick: {fn: view.gridItemMouseOver, scope: this},
containerdblclick: {fn:view.gridItemMouseOver, scope: this},
containermouseup: {fn: view.gridItemMouseOver, scope: this},
containermouseover: {fn: view.gridItemMouseOver, scope: this},
containermouseout: {fn: view.gridItemMouseOut, scope: this},
beforeitemmouseenter: {fn: view.gridItemMouseOver, scope: this},
beforeitemmouseout: {fn: view.gridItemMouseOut, scope: this}
});
};

this.grid.on('afterrender', this.onGridRender, this.grid);


//I wish you a good day
I wish you a good day