comp.lang.javascript archive
Re: accessing the value of dynamically added fields by Name
Date: Thu Mar 30 2006 - 15:23:57 CEST
stellstarin@gmail.com wrote:
> I have a html where fields are created and added dynamically on the
> client side. I use the
>
> AppendChild() call to create fields dynamically.
>
> On submit i try to get the value for all the elements in the form,
> including those that are added
>
> dynamically. I use document.getElementsByName('Field Name')to achieve
> the same.
>
> But this function returns 'undefined' for all dynamically added
> elements.
>
> Any pointers on why this happens ?
>
> The sample HTML code is added below,
>
> <html>
> <head><title>Checking multiple fields with same name</title>
> </head>
> <script>
> //------------------------------------------------------------------------------
> // function to add the hidden field dynamically
>
> function addField (form, fieldType, fieldName, fieldValue) {
> var input = document.createElement('INPUT');
> if (document.all) { // what follows should work
> // with NN6 but doesn't in M14
You didn't test for createElement, so why test for a Microsoft proprietary
method, then proceed to use properties that are totally unrelated?
if (!document.createElement) return;
var oInput = document.createElement('input');
> input.type = fieldType;
> input.name = fieldName;
> input.value = fieldValue;
> }
> else if (document.getElementById) { // so here is the
> // NN6 workaround
Forget this part of the loop, so you have:
function addField (form, fieldType, fieldName, fieldValue)
{
if (!document.createElement) return;
var oInput = document.createElement('input');
oInput.type = fieldType;
oInput.name = fieldName;
oInput.value = fieldValue;
}
Noting that IE has problems with creating some elements (e.g. option
elements) using DOM methods.
[...]
> function check()
> {
> addField (document.checkform, "text", "newfield1",100);
> var e = document.getElementsByName('newfield1') ;
getElementsByName returns a collection - but you don't need to use it
anyway. Have your addField() function return a reference to the new
element, then you don't have to go and get it. Add this as the last line
of addField():
return oInput;
And in check() use:
var e = addField( ... );
Now e is a reference to the new element.
[...]
-- RobReceived on Mon May 1 04:32:21 2006