Getting element created on the fly

[CMaso]

In a function, I created a hidden field and attached it to my form object like so:

var objForm = document.getElementById("myForm");
var objHiddenField = document.createElement("input");

objHiddenField.setAttribute("type" ,"hidden");
objHiddenField.setAttribute("name" ,"value_1");
objHiddenField.setAttribute("value", "22");

objForm.appendChild(objHiddenField);

So now the field has been created, named, populated, and attached to myForm. However, I know that I can't just reference it using document.getElementById("value_1"). That's a problem, because I need to removeChild() this hidden field if a checkbox gets checked. Is there a way to be able to reference this object?

Thanks,
CM

[godofreality]

var objForm = document.getElementById("myForm");
var objHiddenField = document.objForm.value_1;


or


var objForm = document.getElementById("myForm");
var objHiddenField = document.createElement("input");

objHiddenField.setAttribute("type" ,"hidden");
objHiddenField.setAttribute("name" ,"value_1");
objHiddenField.setAttribute("value", "22");
objHiddenField.id = "value_1";

objForm.appendChild(objHiddenField)


then referencing it like

document.getElementById('value_1');

[rnd me]

However, I know that I can't just reference it using document.getElementById("value_1"). That's a problem, because I need to removeChild() this hidden field if a checkbox gets checked. Is there a way to be able to reference this object?
Thanks,
CM

yes:
document.getElementsByName("value_1")[0];

[Kor]

id and name are different referential tokens. name may be common for the form's elements, while id must be unique on document. To refer an element by its id, use getElementById() method. To refer an element by its name, use getElementsByName() method. The latest, as you can see, refers a collection of elements (quite alike an array), and the recommendation is to be used only in case of form's elements (where in fact it has a define role in submitting data).

But:


var objHiddenField = document.createElement("input");
objHiddenField.setAttribute("name" ,"value_1");


This won't work in IE (ant least not in IE 6 and 7). IE has a bug: it can not create the name attribute for the elements on using standard DOM method setAttribute(). So that you need a workaround like:

var isIE = /*@cc_on!@*/false; //IE detector
var objHiddenField;
if(isIE){
objHiddenField = document.createElement('<input name="value_1">');
}
else{
objHiddenField = document.createElement("input");
objHiddenField.setAttribute("name" ,"value_1");
}
// ... the rest of the code