DOM to set an event handler

[george]

I am trying to use DOM to assign an event handler to a form element. The code I am using is

	var oMyForm = document.getElementById('myform');	for (var i=0; i<oMyForm.length; i++) {			vElemID = oMyForm[i].id;			document.getElementById(vElemID).onfocus = function() {				document.getElementById(vElemID).value="";				document.getElementById(vElemID).bgColor="yellow";			} 	}

It seems to be failing at:

document.getElementById(vElemID).onfocus = function() {...}

Anything jump out? TIA

[Ingolme]

For one thing, this oMyForm isn't an element.Maybe you're trying to access all the <input> elements in the form?If that's the case, you'll need to put this line:

var oMyForm = document.getElementById('myform').getElementsByTagName("input");

[Jesdisciple]

EDIT: Dern... But in Firefox, that actually is an element. Without that feature, he could still use the elements collection.I didn't think a form had array-esque indexes, but it does - so congrats for finding that.Your problem seems to be that you didn't give your form elements IDs, attributes default to empty, and this is always null:

document.getElementById('')

[george]

All form elements have an id and a name attribute defined in the form. If I condense the code to just this:

   var oMyForm = document.getElementById('myform');	for (var i=0; i<oMyForm.length; i++) {			alert( oMyForm[i].id );	}

Then I will get an alert telling me the id of each element in the form. What I need to do, is, given a DOM reference to the onfocus event handelr, assign a function to that, which I thought would be

document.getElementById(ElemID).onfocus = myFunc();

This is to replace the inline

<input type="text" onfocus="myFunc();"

with it's unobtrusive form. Thanks

[george]

If the obtrusive form of assigning a javascript function to the onfocus event of an input tag is:<input type="text" id=”txEle” name=”txEle” onfocus="myFunc();" />Then what is the unobtrusive formdocument.getElementById(‘txEle’).onfocus = myFunc(); is not working. I am trying to use DOM to assign an event handler to a form element. Any ideas?

[aspnetguy]

you have to do it one of these ways

document.getElementById(‘txEle’).onfocus = myFunc;document.getElementById(‘txEle’).onfocus = function() { myFunc(); };document.getElementById(‘txEle’).onfocus = function() { /*your code here */ };

[george]

All day long, same problem. I am trying to add an event handeler to all form elements after the page loads.

onload = loadon;function loadon() {	window.status = "Page is loaded, loading form attributes.";	var oMyForm = document.getElementById('myform');	for (var i=0; i<oMyForm.length; i++) {   		vElemID = oMyForm[i].id;		document.getElementById(vElemID).onfocus = NewFocus;	}}function NewFocus() {	document.getElementById(vElemID).style.color = "#000000";	document.getElementById(vElemID).style.background = "#FFFFFF";	document.getElementById(vElemID).value="";}

[george]

Saved - from another day facing the same problem.

onload = loadon;function loadon() {	window.status = "Page is loaded, loading form attributes.";	var oMyForm = document.getElementById('myform')	var oInputs = oMyForm.getElementsByTagName('input');	for (var i=0; i<oInputs.length; i++) {   		oInputs[i].onfocus = function() {			this.style.color = "#000000";			this.style.background = "#FFFFFF";			this.value="";		}	}}

Thanks for the help guys.