PDA

View Full Version : Ext.grid.GridView.getCellByXY(x, y)



diovani
12 Jul 2012, 5:03 AM
The method bellow intends to get a cell reference by the mouse or other element position in page.
It'll return an array with the cell row and col (useful for getting fieldName and record) and the cell element (td) itself.

I need this to create a trigger on every cell to show a menu on an EditorGrid, and RightClick was not an option.

Here's the overrides to add the method to GridView:



Ext.override(Ext.grid.GridView, {
/**
* Returns a cell row, col, and element, by the xy coodinates
*
* @param {Integer} x
* @param {Integer} y
* @returns {Array} [row, col, el]
*/
getCellByXY: function(x, y) {
var view = this,
rows = view.getRows();

//loop rows
for (var i = 0; i < rows.length; i++) {
var j = 0, cell;
//loop cells in row
while (cell = view.getCell(i, j)) {
var cellEl = Ext.get(cell);

if (cellEl.getTop() <= y && cellEl.getBottom() >= y) {
if (cellEl.getLeft() <= x && cellEl.getRight() >= x) {
return [i, j, cell];
}
} else {
//prevent useless cell loops in wrong row
break;
}

j++;
}
}

}
});


Usage example:



//on any element positioned above grid
click: {
fn: function(ev, el) {
var xy = ev.getXY(),
cell = this.getView().getCellByXY(xy[0], xy[1]);

//console.log(cell);
//to domething
},
scope: grid
}