Hi all,

I have a custom object that I have created which validates textboxes holding dates.

Code:
var dates = new Array();
window.onload = function () {

	// Dates fields to validate
	dates[dates.length] = new DateValidationControl(document.searchCritreaForm.FromEngComp, document.imgFromEngComp);
	dates[dates.length] = new DateValidationControl(document.searchCritreaForm.ToEngComp, document.imgToEngComp);

	dates[dates.length] = new DateValidationControl(document.searchCritreaForm.FromRecRet, document.imgFromRecRet);
	dates[dates.length] = new DateValidationControl(document.searchCritreaForm.ToRecRet, document.imgToRecRet);

}
The first passed in variable is the input type="text" elements, second one is the image next to it which displays a cross or tick depending on if its valid.

I wont show you all the code but just the relevant bits here, the object creation...

Code:
function DateValidationControl(oTextbox, oIcon) {

	// textbox holding date
	this.textbox = oTextbox;
	
	// information on date

	this.validDate = true;
	this.day = null;
	this.month = null;
	this.year = null;
	
	this.dtCh= "/";

	

	// Removed as dont think we need this

	/*
	this.minYear = 1900;
	this.maxYear = 2100;
	*/
	

	// Image variables
	this.icon = oIcon;
    this.oldSrc = "";
    this.busySrc = "/jpreturn/images/progress.gif";
	this.okSrc = "/jpreturn/images/tick.gif";
	this.failSrc = "/jpreturn/images/cross.gif";

	// Set on the events to trigger of the validation
	this.init();
}


// Initise the object to set up event handlers
DateValidationControl.prototype.init = function () {

    //save a reference to this object
    var oThis = this;
    
    if (this.icon) {
		this.oldSrc = this.icon.src;
	}
    
    //assign the onkeyup event handler
    this.textbox.onkeyup = function (oEvent) {
       	oThis.validateDate();
    };
    
  
    //assign onblur event handler
    this.textbox.onblur = function () {
       	oThis.validateDate();
    };
    
    
    // if a form reset is performed, validate the date
    this.textbox.form.onreset = function() {
    	oThis.validateDate();
    }
};
This has been working fine for now, on submit of the form I loop through all the date Validation objects to check if "validateDate" is true.

There is a problem tho now I have discovered, if I enter some rubbish dates and try submit it doesn't allow it, thats fine, however, when I hit reset, the objects do get not get updated and despite them now being blank, no event has triggered to update there status's. I tried adding onchange in the init method, that did no good, My latest effort (in red) is to set the onreset method but this would only work if I had one date field as the function is just getting overwritten.

So im wondering if there is a way to rather than setting a new function for the form reset, if it is possible to add code into the function so I could call validate for each dateValidation object?

If there is a much simplier way that I have overlooked to update the objects status onreset please let me know.

I know I could simply loop through my array of dateValidation objects and call the validateDate function but I want to keep as much code as possible in the object so it easy to reuse.

Help very much appricated.
Thanks,
Dale