class-based (OO?) type-ahead combobox (attn: glenngv)

So I'm finally trying to turn the type-ahead combobox that GlennGV wrote and I augmented into an easy-to-instantiate class, but I'm running into trouble.

(code is attached, including example instantiation)

How is it best to assign event handlers to elements using class-based scripting? I've got the constructor function accepting two arguments: the ID of the element which will be the type-ahead combobox, and the name of the variable (object) that's created to hold the functions and properties.

When no arguments are passed to the constructor, I return; because at that point I'm just setting up the prototype. I create the methods, set up the prototype with the argument-free constructor, assign the prototype properties, and assign the methods to the prototype as the script loads. On page load, the object is created with a call to the constructor.

The constructor assigns the event handlers to the select element, but as the handlers themselves are methods of the object created by the constructor, I have to use a latent-assignment method (hence the reason I'm passing in the name of the variable that is the object).

Relevant bit of code:
function GVECD_Combo(anElement, theVarContainer) {
...
this.element = anElement;
// event handlers
this.element.onkeydown = theVarContainer + ".elementKeydown()";
this.element.onfocus = theVarContainer + ".elementFocus()";
this.element.onclick = theVarContainer + ".updateIndex()";
this.element.onblur = theVarContainer + ".updateIndex()";
}

This isn't working. When I alert() the select element's onfocus method, it shows me the right text, but it means nothing to the script engine.

You all know I don't wish to use eval() - but right now I'm seeing only that and one other option: DOM2Events by Chris Nott, which I like but would prefer to not use because I really don't want to build a class dependent upon another class.

Any help? TIA, ecd.

Okay - first of all, you don't need to initialize the object for the prototype stuff to be added. Doing so would be redundant (even if it worked that way, which it doesn't). By creating properties on the prototype, you give all those properties to ALL instances of that object.

Second, assigning object methods to your event handlers is simpler than you think. Remember, they expect a function reference.

this.element.onkeydown = this.elementKeydown;
this.element.onfocus = this.elementFocus;
this.element.onclick = this.updateIndex;
this.element.onblur = this.updateIndex;

Make sense?

Thanks for the tips, beetle. I actually got this working about 45 minutes after I started the thread, exactly by switching the handler assignments to this.elementKeydown, etc. - and then I found I needed to change the element's event handlers to refer to this.combo, a new property that is assigned to the element in the constructor:
this.element.combo = this;

About creating the prototype, I guess I'm getting better at using javascript, but not so much better at understanding its inner workings. Why is it redundant? Why wouldn't I want the prototype to contain those properties? I know each new object will contain the same properties as the prototype, and that's what I'm hoping for, so I can change the properties of each individual select box (such as turn off the status display in one box, but not all of them). Is there anything wrong with this?

You misunderstand. You DO want the prototype to have those properties - but you don't need to initialize the object for those properties to be applied. So, your whole process of creating an object w/o arguments is unecessary.

Ah, you are correct, I misunderstood.

Here's an updated copy of the script; let me know your thoughts. Maybe I'll post it in "Post A Script"