PDA

View Full Version : pass the event object to the "on" method of Ext.Element



flamant
16 Nov 2010, 8:01 AM
Hi,

I set a click handler on an element this way :



var elt = scope.getEl();
elt.on('click', clickFunction.createDelegate(scope, [sptNbr, gridNbr, scope.recordId, remoteGridJsonStore]));


The problem is that I haven't the event object passed to the handler function.

Is it possible to pass the event object and how ?

plalx
16 Nov 2010, 8:36 AM
I might be wrong, but I'am pretty sure that you can't... the event object will be generated by the browser when the event will occur, you can't get a reference to it until it occurs...

You can do something like this instead, e.g. but that requires that you define your clickFunction inline.


Ext.onReady(function() {

elt.on({
'click': function(e, t, o) {
console.log(e); //access event obj
console.log(sptNbr); //Variables are accessible because of the closure.
},
scope: scope
});
});

darthwes
16 Nov 2010, 8:37 AM
Something like this?


elt.on('click', function(evt, targ, opts) {
clickFunction.apply(this, [evt, targ, opts, sptNbr, gridNbr, this.recordId, remoteGridJsonStore]);
}, elt);

plalx
16 Nov 2010, 8:40 AM
even better ;)

laurentParis
16 Nov 2010, 8:40 AM
var params = {
fn: clickFunction,
sptNbr: sptNbr,
gridNbr: gridNbr,
id: scope.recordId,
remoteGridJsonStore: remoteGridJsonStore
};
elt.on('click', function (params) {
return function (e) {
params.event = e;
params.fn.call(this, params);
};
}(params), scope);

flamant
16 Nov 2010, 9:29 AM
Thank you all for your answers

I have found another solution that also works (I tested it) :



elt.sptNbr = sptNbr;
elt.gridNbr = gridNbr;
elt.recordId = recordId;
elt.remoteGridJsonStore = remoteGridJsonStore;
elt.on('click', function(evt, elRef) {
rowClickHandler(this.sptNbr, this.gridNbr, this.recordId, this.remoteGridJsonStore)
});