PDA

View Full Version : cellclick before rowclick event?



justinwooe
10 Oct 2010, 10:15 PM
Hi,

I have a grid panel which has 2 events: 'cellclick', 'rowclick', and one column with a button in the row,
when click the button, fire the 'cellclick' event,
when click the row without the button area, fire the 'rowclick' event.

The issue is that in the source codes below, 'rowclick' event always fired before 'cellclick' event.
I cannot only fire 'cellclick' event and no 'rowclick' event fired.

Please give me help. Thanks.


processEvent : function(name, e) {
var t = e.getTarget(),
g = this.grid,
header = this.findHeaderIndex(t);
g.fireEvent(name, e);
if (header !== false) {
g.fireEvent('header' + name, g, header, e);
} else {
var row = this.findRowIndex(t),
cell,
body;
if (row !== false) {
g.fireEvent('row' + name, g, row, e);
cell = this.findCellIndex(t);
if (cell !== false) {
g.fireEvent('cell' + name, g, row, cell, e);
} else {
body = this.findRowBody(t);
if (body) {
g.fireEvent('rowbody' + name, g, row, e);
}
}
} else {
g.fireEvent('container' + name, g, e);
}
}
}

Condor
10 Oct 2010, 11:06 PM
Why not check in the cellclick and rowclick event is the user clicked on the button?

justinwooe
11 Oct 2010, 12:00 AM
Why not check in the cellclick and rowclick event is the user clicked on the button?

Thanks,

I already have a cellclick event handler


function(grid,rowIndex,columnIndex,e){
var html = e.getTarget();
if (html.nodeName.toLowerCase()==='img') { // the button is an image
var rec = grid.getStore().getAt(rowIndex);
e.stopEvent(); // want to stop rowclick event here.
// do actions here
}
}

What I want is handling the click event on the button and stopping rowclick event.

Condor
11 Oct 2010, 12:03 AM
rowclick and cellclick are not interdependent.

You will have to add the same getTarget check to the rowclick event handler.

justinwooe
11 Oct 2010, 12:19 AM
rowclick and cellclick are not interdependent.

You will have to add the same getTarget check to the rowclick event handler.

We used Ext.ux.RowEditor in this grid. It also listens to "rowclick" event. We don't want the RowEditor shown up while clicking on the button.

We can add a event listener for "rowclick" to check that, but it alway comes after the RowEditor showing up.

It is assumed that all the event in Ext should be using the popup model. As seen in the source, it breaks the rule here. It fires the "rowclick" before "cellclick". Is it an issue?

Condor
11 Oct 2010, 12:25 AM
You'll have to intercept the events in the RowEditor itself, e.g.

var editor = new Ext.ux.grid.RowEditor({
...
onRowClick: function(g, rowIndex, e){
if (!e.getTarget('img', 1)) {
this.constructor.prototype.onRowClick.call(this, g, rowIndex, e);
}
},
onRowDblClick: function(g, rowIndex, e){
if (!e.getTarget('img', 1)) {
this.constructor.prototype.onRowDblClick.call(this, g, rowIndex, e);
}
}
});

justinwooe
11 Oct 2010, 12:53 AM
OK, that works, thanks a lot.

Animal
11 Oct 2010, 2:00 AM
In 3.3 and above, this happens in a more logical, "outwards bubbling" order.

cellclick is fired first, then the event is passed to the ColumnModel to distribute, and then rowclick is fired.

justinwooe
11 Oct 2010, 4:43 AM
In 3.3 and above, this happens in a more logical, "outwards bubbling" order.

cellclick is fired first, then the event is passed to the ColumnModel to distribute, and then rowclick is fired.

Thanks,
I just downloaded version 3.3 beta 2 and checked the source codes of GridView.js, it's more reasonable and elegant. :)