Problem with function insertBefore()

J

Janis Papanagnou

This is partly a repost that was maybe too buried to be seen. Sorry for
that. I thought it would be an easy to be answered question, but I may be
wrong...

I wanted to _insert_ cloned table row into the same table, and while using
appendChild() worked fine insertBefore() - which is what I actually need -
resulted in an error.

This code works...

active_row = document.getElementById ("Active_Row")
cloned_row = active_row.cloneNode (true)
document.getElementById ("Table").appendChild (cloned_row)

But trying to insert it before active_row with this code failed[*]...

active_row = document.getElementById ("Active_Row")
cloned_row = active_row.cloneNode (true)
document.getElementById ("Table").insertBefore (cloned_row, active_row)

What's wrong with that code? Any insights greatly appreciated!

Janis

[*] The error messages in the Javascript console:

Error: uncaught exception: [Exception... "Node was not found"
code: "8" nsresult: "0x80530008 (NS_ERROR_DOM_NOT_FOUND_ERR)"
location: "file:... Line: 390"]
 
R

RobG

Janis said:
This is partly a repost that was maybe too buried to be seen. Sorry for
that. I thought it would be an easy to be answered question, but I may be
wrong...

I wanted to _insert_ cloned table row into the same table, and while using
appendChild() worked fine insertBefore() - which is what I actually need -
resulted in an error.

This code works...

active_row = document.getElementById ("Active_Row")
cloned_row = active_row.cloneNode (true)
document.getElementById ("Table").appendChild (cloned_row)

That won't work in IE because it wants to append rows to a tbody, not a
table. Also, you need to change the id of the cloned row otherwise
you'll have duplicate IDs, which is invalid HTML.

var active_row = document.getElementById("Active_Row");
var cloned_row = active_row.cloneNode(true);
cloned_row.id = '';
active_row.parentNode.appendChild(cloned_row);

Opinions differ on the use of semi-colons to end statements, however I
think it's much better to always use them. It's also better to not put
a space between an identifier and an opening bracket '(', and always
use var to keep variables local unless you have a good reason not to
use it.

But trying to insert it before active_row with this code failed[*]...

active_row = document.getElementById ("Active_Row")
cloned_row = active_row.cloneNode (true)
document.getElementById ("Table").insertBefore (cloned_row, active_row)

What's wrong with that code? Any insights greatly appreciated!

Try:

var active_row = document.getElementById("Active_Row");
var cloned_row = active_row.cloneNode(true);
cloned_row.id = '';
active_row.parentNode.insertBefore(cloned_row, active_row);
 
J

Janis Papanagnou

RobG said:
That won't work in IE because it wants to append rows to a tbody,

I have to admit I don't understand why. But okay, I'll avoid that.
not a
table. Also, you need to change the id of the cloned row otherwise
you'll have duplicate IDs, which is invalid HTML.

Yes, that's what I feared. (I mentioned that in the other thread.)
var active_row = document.getElementById("Active_Row");
var cloned_row = active_row.cloneNode(true);
cloned_row.id = '';
active_row.parentNode.appendChild(cloned_row);

Opinions differ on the use of semi-colons to end statements, however I
think it's much better to always use them. It's also better to not put
a space between an identifier and an opening bracket '(', and always
use var to keep variables local unless you have a good reason not to
use it.

Thanks, I'll keep that in mind.
But trying to insert it before active_row with this code failed[*]...

active_row = document.getElementById ("Active_Row")
cloned_row = active_row.cloneNode (true)
document.getElementById ("Table").insertBefore (cloned_row, active_row)

What's wrong with that code? Any insights greatly appreciated!

Try:

var active_row = document.getElementById("Active_Row");
var cloned_row = active_row.cloneNode(true);
cloned_row.id = '';
active_row.parentNode.insertBefore(cloned_row, active_row);

Clearing 'id' and using 'parentNode' indeed fixed the problems I had.

That was very helpful advice; thanks a lot! :)

Janis
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,755
Messages
2,569,537
Members
45,020
Latest member
GenesisGai

Latest Threads

Top