PDA

View Full Version : How can I add an listener to an image in a grids cell



Dumas
7 Aug 2010, 5:25 AM
Hi!

I have a grid and in the name column is an image which should ahve an click listener. Is there a more performant solution then this?


var grid = new Ext.grid.EditorGrid({
...
columns: [{
header: 'Name',
dataIndex: 'name',
renderer: function(value, metaData, record) {
return value + '<img src="img/icons/add.png" alt="add" style="align:right;">';
}
}]
listeners: {
cellclick: {
fn: function(grid, rowIndex, columnIndex, eventObject) {
if(rowIndex === 0) { // name row
this.onAddImageClick(e);
}
},
scope: this,
delegate: 'img'
}
} //eo listeners
});

thx
Roland

Condor
7 Aug 2010, 5:29 AM
1. Why only for rowIndex === 0? It's more common to restrict to a certain column.
2. Are you using the cellclick event for other actions too? In that case you could replace the 'delegate' with an eventObject.getTarget() check.

Dumas
7 Aug 2010, 6:12 AM
1. Why only for rowIndex === 0? It's more common to restrict to a certain column.
Upps, I ment if(columnIndex === 0)

2. Are you using the cellclick event for other actions too? In that case you could replace the 'delegate' with an eventObject.getTarget() check.
No, only for this function. That's the reason why I did the delegate, I thought this would be more performant.

thx
Roland

Condor
7 Aug 2010, 6:55 AM
2. Using delegate will go up the parent tree to find the element, but this is not needed for an image (it has no child elements). As a result, checking eventObject.getTarget() is probably faster.

Animal
7 Aug 2010, 7:20 AM
Don't put too much work into it if you intend to upgrade to 3.3

http://dev.sencha.com/deploy/ext-3.3-beta1-6976/docs/?class=Ext.grid.ActionColumn

http://dev.sencha.com/deploy/ext-3.3-beta1-6976/examples/grid/array-grid.html

Dumas
8 Aug 2010, 7:09 AM
I'm already using Saki's rowAction (which is essetially the same as the new ActionColumn), but this is different:
The image doesn't have an own column and will be displayed only on the active column and should then be clickable...

regards,
Roland