Realtidsvalidering av inmatning

Hej.

Jag ska skapa en funktion för att kontrollera om användarens inmatning är korrekt.

Detta är tanken:

<input type="text" name="date" id="date" onkeyup="validate();" onkeypress="validate();"/>

Sedan vill jag att det ska stå vid <input> elementet "Fältet är tomt", "Felaktigt datum" "_veckodagen_ifall_korrekt_datum" osv..

Just nu har jag:

<input class="smallTextInput" type="text" onkeyup='validate(document.getElementById( "dStartDateTime" ).value, "dStartDateTime");' onkeypress='validate(document.getElementById( "dStartDateTime" ).value, "dStartDateTime");' name="dStartDateTime" id="dStartDateTime" />

	function validate(sDate, target)
	{
		var arr = str2RegexArr(sDate);
		
		var x = document.forms['oForm'].elements;
		var err = true;
		if(sDate == null || sDate == "")
		{
			//alert('23');
			writeError(x[target], 'Kenttä jäi tyhjäksi');
			err = false;		
		}
		else if(arr == null || arr.length != 6)
		{
			//alert('sss');
			x[target].onchange = removeError;
			writeError(x[target],'Virheellinen päivämäärä');
			err = false;
		}
		else if(!validateDate(arr[1], arr[2], arr[3], arr[4], arr[5]) )
		{
			writeError(x[target],'Virheellinen päivämäärä');
			
			err = false;
		}
		
		return err;
	}		

	function writeError(obj,message) {
		validForm = false;
		if (obj.hasError) return;
		
		if (W3CDOM) {
			obj.className += ' error';
			obj.onchange = removeError;
			var sp = document.createElement('span');
			sp.className = 'error';
			sp.appendChild(document.createTextNode(message));
			obj.parentNode.appendChild(sp);
			obj.hasError = sp;
		}
		else {
			errorstring += obj.name + ': ' + message + '\n';
			obj.hasError = true;
		}
		
	}	
	
function removeError() {
	this.className = this.className.substring(0,this.className.lastIndexOf(' '));
	this.parentNode.removeChild(this.hasError);
	this.hasError = null;
	this.onchange = null;
}

Jag har problem med att få error-fältets text att uppdateras korrekt. Jag vill at den skall ändras genast då innehållet förändras (om förändringen bidrar till en annan text, dvs).

Hej! :)

Varför inte göra det enkelt?

<input class="smallTextInput" type="text" onkeyup="validate(this.value, 'spanCmt');" onkeypress="validate(this.value, 'spanCmt');" name="dStartDateTime" id="dStartDateTime" /> 

<span id="spanCmt"></span>

    function validate(sDate, target) 
    { 
	var spanCmt = document.getElementById(target);
	var arr = str2RegexArr(sDate);
	if (sDate == "") spanCmt.innerHTML = "Fältet är tomt";
	else if (arr == null || arr.length != 6) spanCmt.innerHTML = "";
	else if (!validateDate(arr[1], arr[2], arr[3], arr[4], arr[5])) spanCmt.innerHTML = "Felaktigt datum";
	else spanCmt.innerHTML = "\"Veckodag här\"";
    }            
     
window.onload = function()
{
	validate(document.forms["oForm"].elements["dStartDateTime"].value, 'spanCmt');
}

Givetvis! Gärna så enkelt som möjligt. Tack! Skall testa det nu. Enda kruxet är att jag inte kommer att kunna placera window.onload = xxx i head-taggen pga att sidan som scriptet skall placeras, inte är en komplett html-sida, utan laddas in.

Sen har jag även läst att man inte ska använda xxx.innerHTML, men det kanske är en pyttesak? :)

Kanon, Peter S! :)

Först så var det lite konstigt då "fältet är tomt" blinkadetill snabbt men så klistrade jag in window.onload = xxx och vips så funkade det prima!