Scope and parameters

[vatech1993]

I've currently created a javascript object that constructs a html object (tr). I'm wanting an event to fire off when a user clicks this object. This was pretty easy by just defining as shown below:


tr.onclick= function(){
//some business logic
}

The problem I'm having is that I want to be able to access information about the clicked HTML object as well as information within the javascript object that contains all this code. Within the above example if I use the "this" object, I have a reference to the clicked html object, but I can't get access to the instance of the javascript object. I've tried using the EventManager as follows:


YAHOO.ext.EventManager.on(tr.id, 'click', this.clickRow, this, true);

When I do this and I use the "this" object, I have access to the javascript object, but I can't access any information about the clicked html object.

Is there a way to access both?

[jack.slocum]

There are a couple ways. The EventManager will pass in an "e" EventObject argument. One of it's methods is getTarget(). Since the target may be a cell, you may have to use findTarget(null, 'tr'); for it to get the row target.

The second way is to use createDelegate.

This will call clickRow with the tr as the first argument.
YAHOO.ext.EventManager.on(tr, 'click', this.clickRow.createDelegate(this, [tr]));

This will call clickRow and append the tr as an additional argument (so the "e" is still the first arg):
YAHOO.ext.EventManager.on(tr.id, 'click', this.clickRow.createDelegate(this, [tr], true));

createDelegate and other useful functions are defined on the Function object in the docs.