Hi all,

Just a quick javascript question. I have been playing with objects in JS with some success, but have come accross a bit of a problem, which I cant quite get my head around.

I have a project in which multiple forms are used, so i created a class which would carry out the repetetive processes I was going through for each form. In use, the object is first created, then init is called to add the appropriate event listeners and carry out the required tasks etc. the code is below

Code:
function formHandler(form, url)
{
    //form object
    this.form = form;
    this.url = url;
    
    /*
    * Function to initialise the form
    */
    this.init = function() {
            
        //Add the highlightors
        this.addHighlightor(this.form.getElementsByTagName("input"));
        this.addHighlightor(this.form.getElementsByTagName("select"));
        this.addHighlightor(this.form.getElementsByTagName("textarea"));
        
        //Give focus to the form
        Form.focusFirstElement(form);
        
        //Add the onsubmit handler
        form.onsubmit = this.validate;
        
                
    }
    
    
    /*
     * Function takes an array of objects and adds a highlightor event to their parent nodes
    */
    this.addHighlightor = function(elems) {
        for (var i = 0 ; i < elems.length ; i++) {
          elems[i].onfocus=function(){
            if (this.parentNode.className != "submit")
                this.parentNode.className+=" active";
          };
          elems[i].onblur=function(){
            if (this.parentNode.className != "submit") {
                //Get original class name
                var name = this.parentNode.className.split(" ");
                if (name[1] == undefined) {
                    this.parentNode.className=name[1];
                } else {
                    this.parentNode.className="";
                }
            }
          };
        }
    }
    
    this.test = function() {
        alert('test');    
    }
    
    this.test2 = function() {
        alert('called');
        this.test();    
    }
    
    /*
     * Function validates the inputs within the form if there is a class name of required
     * @return
    */
    this.validate = function() {
        
        //Use prototype to obtain all the elements in the form
        var elements = Form.getElements(form.id);
        
        
        for (var i = 0 ; i < elements.length ; i++) {
            if(elements[i].className.indexOf('required') != -1) {
                if (!Field.present(elements[i])) {
                    
                    //find the label
                    for(var y=0 ; y < elements[i].parentNode.childNodes.length ; y++) {
                        if (elements[i].parentNode.childNodes[y].tagName == "LABEL") {
                            var desc = elements[i].parentNode.childNodes[y].innerHTML;
                        }
                    }
                    
                    alert(desc+" must be entered");
                    elements[i].style.backgroundColor = "#FFC7D4";
                    elements[i].focus();
                    return false;    
                }
            }
        }
        this.test2();
    }
}
The problem I am having is with the onsubmit event listener for the form. The vaidate function is performed onsubmit, but when it reaches this.test2() it tells me it isnt a function and dies.

After ruling out typos etc I think this is something more fundamental that I am not understanding so any help would be greatly appreciated!

Many many thanks

/Matt