problem with "this" and context

[cmay]

I am having a problem with the use of "this". Maybe someone can help
me out here, let me know if I am doing this wrong:


Lets say I have an object MyObject, which has local variables, and some
methods. One of the local variables is an HTML input box. On
mousedown I want to execute some code like this:


function MyObject(inputF ieldID){
// get the HTML element
this.InputField = document.getEle mentById(inputF ieldID);
// local variable
this.MyID = inputFieldID;
// function trying to run
this.MyFunction = function(){
alert(this.MyID );
}

this.InputField .onkeydown = this.MyFunction ;

}


Now when you keydown inside the input textbox it errors because inside
the MyFunction function "this" doesn't refer to the object MyObject,
but rather to the Input element.

The only workaround I have found is to give the InputField a reference
to its owner so you have:

this.InputField .MyObject = this;

And then when your MyFunction becomes:
this.MyFunction = function(){
alert(this.MyOb ject.MyID);
}


That works, but it seems like a pain to have to carry those references.

Is there another way to do this?

[Lasse Reichstein Nielsen]

Re: problem with "this&quot ; and context

"cmay" <cmay@walshgrou p.com> writes:
[color=blue]
> I am having a problem with the use of "this". Maybe someone can help
> me out here, let me know if I am doing this wrong:[/color]
[color=blue]
> Lets say I have an object MyObject, which has local variables, and some
> methods.[/color]

Objects don't have local variables, so I guess you just mean
properties.
[color=blue]
> One of the local variables is an HTML input box.[/color]

A DOM HTMLInputElemen t object.
[color=blue]
> function MyObject(inputF ieldID){[/color]
....[color=blue]
> this.MyFunction = function(){
> alert(this.MyID );
> }[/color]
[color=blue]
> this.InputField .onkeydown = this.MyFunction ;[/color]
....
[color=blue]
> Now when you keydown inside the input textbox it errors because inside
> the MyFunction function "this" doesn't refer to the object MyObject,
> but rather to the Input element.[/color]

Yes. The "this" operator refers to the base object of the property
reference that was called. When the onkeydown property of the input
element is called, "this" will refer to the input element during
the execution of the body of the function. That means that
alert(this.MyID )
will alert the undefined value.
[color=blue]
> The only workaround I have found is to give the InputField a reference
> to its owner so you have:
>
> this.InputField .MyObject = this;[/color]

Refernces between DOM objects and other objects is known to cause
memory leak in IE. You are already doing that, but no need to compound
the problem :)
[color=blue]
> And then when your MyFunction becomes:
> this.MyFunction = function(){
> alert(this.MyOb ject.MyID);
> }[/color]
[color=blue]
> Is there another way to do this?[/color]

Try:

var self = this;
this.MyFunction = function() {
alert(self.MyID );
}

The "self" variable will copy the refrence to the MyObject instance,
so that it is available to the function.

/L
--
Lasse Reichstein Nielsen - lrn@hotpop.com
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleD OM.html>
'Faith without judgement merely degrades the spirit divine.'

[cmay]

Re: problem with &quot;this&quot ; and context

Great, thanks.