By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
437,636 Members | 1,213 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 437,636 IT Pros & Developers. It's quick & easy.

another wacky IE problem

P: n/a
i've got a form element (named 'elemA') created in html.

dynamically, in javascript, i duplicate this
element and rename the new element 'elemB'

var elem_a = ...
var elem_b = elem_a.createNode(true);
elem_b.name = 'elemB';

i then add this to the document.

when i print out document.forms[0] array, i can
see the new element listed.

but when i do

document.forms[0]['elemB'] does not find it.

whereas

document.forms[0]['elemA'] works as expected

anyone know why

document.forms[0]['elemB'] does not work

Aug 29 '06 #1
Share this Question
Share on Google+
8 Replies


P: n/a
Where did you add elemB? Did you append it to the form or to the
document?

Aug 29 '06 #2

P: n/a

"Tom Cole" <tc****@gmail.comwrote in message
news:11**********************@p79g2000cwp.googlegr oups.com...
Where did you add elemB? Did you append it to the form or to the
document?
i added it to the document.

but when i print out the elements of document.forms[0] ...it's in there.

it's when i try to retrieve it by

documents.forms[0]['elemb'] that i get undefined.

thx
Aug 29 '06 #3

P: n/a

"ppcguy" <go*****@hehe.comwrote in message
news:ju*******************@news-wrt-01.rdc-nyc.rr.com...
>
"Tom Cole" <tc****@gmail.comwrote in message
news:11**********************@p79g2000cwp.googlegr oups.com...
Where did you add elemB? Did you append it to the form or to the
document?

i added it to the document.

but when i print out the elements of document.forms[0] ...it's in there.

it's when i try to retrieve it by

documents.forms[0]['elemb'] that i get undefined.

thx

seems like the new element is part of the form - i can see it
visually and have iterated in a loop and printed the name.

it's almost as if

document.forms[0]['elemb']
or
document.forms[0].elements['elemb']

uses a key to find the entry and the key is not set for the
new element.

i added the new element to the document via

document.insertChild()

and as i wrote before, seems to have also added the new element
to the form.

is there a function i have to call, so that
document.forms[0].elements['elemb']
works.
Aug 29 '06 #4

P: n/a

ppcguy wrote:
i've got a form element (named 'elemA') created in html.

dynamically, in javascript, i duplicate this
element and rename the new element 'elemB'

var elem_a = ...
var elem_b = elem_a.createNode(true);
I think you want cloneNode:

var elem_b = elem_a.cloneNode(true);
There is no "createNode" method in the W3C DOM - have you defined it
elsewhere?

elem_b.name = 'elemB';

i then add this to the document.

when i print out document.forms[0] array, i can
see the new element listed.
document.forms is not an array, it's a node collection. How are you
printing it out? You may have added an "elem_b" property to the
document object, not a DOM element that you think you created.
--
Rob

Aug 30 '06 #5

P: n/a

"RobG" <rg***@iinet.net.auwrote in message
news:11**********************@i42g2000cwa.googlegr oups.com...
>
I think you want cloneNode:

var elem_b = elem_a.cloneNode(true);

my bad..a typo here...it was a cloneNode()

There is no "createNode" method in the W3C DOM - have you defined it
elsewhere?

elem_b.name = 'elemB';

i then add this to the document.

when i print out document.forms[0] array, i can
see the new element listed.

document.forms is not an array, it's a node collection. How are you
printing it out? You may have added an "elem_b" property to the
document object, not a DOM element that you think you created.
i'm printing it out this way:

var msg = "";
for ( var x = 0; x < document.forms[0].elements.length; ++x )
msg += document.forms[0].elements[x].name + ",";
alert(msg);

when i print it (as above), i see the new name.

i think the dom element is created ok because i see a whole row
of new form elements.

but when i try to retrieve an object...not there...all below fail

alert(document.forms[0].elem_b);
alert(document.forms[0]["elem_b"]);
alert(document.forms[0].elements["elem_b"]);

---

i've got a row of form elements.
i did a cloneNode(true) on the table row.
i iterate thru all the new form objects and rename them
node.name = new_name;
then i inserted the new row just before the last row.

---

the page looks right with the new row inserted in the right posn.

when i print the forms array elements (above), the new names are there.

but when i retrieve individual objects, it fails.


Aug 30 '06 #6

P: n/a
here's the full relevent code

function addRows()
{
var table = document.all('main');

var elem = document.createElement("input");
elem.setAttribute( "type", "text");
elem.setAttribute( "name", "elem_b");

table.appendChild( elem );

var msg = "";
for ( var x = 0; x < document.forms[0].elements.length; ++x )
msg += document.forms[0].elements[x].name + ",";

alert(msg); // prints the name ok

alert(document.forms[0].elem_b); // fails
alert(document.forms[0].elements["elem_b"]); // fails
}

Aug 30 '06 #7

P: n/a

jman wrote:
here's the full relevent code

function addRows()
{
var table = document.all('main');
document.all is all but extinct around here, use feature detection and
getElementById. There are various strategies for including support for
ancient IE versions that need document.all, a simple strategy that
provides limited emulation is:

if ( 'function' != typeof document.getElementById
&& 'function' == typeof document.all )
document.getElementById = document.all;
}

var elem = document.createElement("input");
elem.setAttribute( "type", "text");
elem.setAttribute( "name", "elem_b");
setAttribute is known to be buggy in IE, just don't use it if there is
any alternative. Use dot property access wherever possible (less
typing too :-) ):

elem.type = "text";
elem.name = "elem_b";
Some might say that since the default type for an input is text,
setting its type attribute to 'text' is redundant. I think you're
better off to set it explicitly.

table.appendChild( elem );
Is table an HTML table element?

Note that the *only* element that can be a child of a table is a table
section element (thead, tfoot or tbody). If you haven't coded a tbody
in the source HTML, one will be added by the browser when it loads the
page - it's a mandatory element, although the tags are optional.

Some browsers (but not IE) let you add TR elements to a table, but they
will actually add them to a tbody section. Adding an input element to
a table will result in invalid HTML - error correction may take over
and put it somewhere else that is valid.

var msg = "";
for ( var x = 0; x < document.forms[0].elements.length; ++x )
msg += document.forms[0].elements[x].name + ",";

alert(msg); // prints the name ok

alert(document.forms[0].elem_b); // fails
alert(document.forms[0].elements["elem_b"]); // fails
}
That doesn't look much like the code you originally posted. Here is a
trivial example, tested in IE and Firefox:

<script type="text/javascript">

function addRow(id){
var table = document.getElementById(id);
var rowToClone = table.rows[0];
var oRow = rowToClone.cloneNode(true);
var input = oRow.getElementsByTagName('input')[0];
input.name = 'input' + table.rows.length;
input.value = '';
rowToClone.parentNode.appendChild(oRow);
}

</script>

<button onclick="addRow('tableA')">Add row</button>
<form action="">
<table id="tableA">
<tr>
<td><input name="input0" onclick="this.value=this.name;"></td>
</tr>
</table>
</form>

Aug 31 '06 #8

P: n/a

RobG wrote:
var input = oRow.getElementsByTagName('input')[0];
name = 'input' + table.rows.length;
input.name = name;
input.value = '';
rowToClone.parentNode.appendChild(oRow);
once added, can you retrieve the object via

alert(document.forms[0].elements[name]);

i think i read somewhere that there is an ie bug.

ie does not add it to the form collection.

thx

Sep 1 '06 #9

This discussion thread is closed

Replies have been disabled for this discussion.