how to copy table td tags from one table row to other table row Options

[kashaboina]

Hi,

I have 2 tables:

<table id=tbl1>
<tr id=tbl1_tr1>
<td id=tbl1_td1>
something……
</td>
</tr>
</table>

<table id=tbl2>
<tr id=tbl2_tr1>

</tr>
</table>

Now I want to copy ‘tbl1_td1’ to ‘tbl2_tr1’ row through javascript.

1q: Is it possible?
2q: If yes, how?

[Christian J]

This is quite possible with the DOM.

To copy a cell, use the cloneNode() method. To insert it into the row you can use appendChild() (puts it after any existing cells) or insertBefore() (puts it before a specified existing cell). See http://www.quirksmode.org/dom/w3c_core.html#nodemanipulation for details.

Keep in mind that adding or removing cells may break the table structure. To avoid that you might begin with a static number of cells, and use replaceChild() to replace an empty one in the second table with a clone of the cell in the first.

[pandy]

Will that get the attributes too? If so, there will be duplicate IDs.

[Christian J]

Attributes will indeed be copied! You might edit their value or simply remove the whole attribute in the copy.

[Christian J]

Another perhaps more robust idea is to copy just the content of the first table's cell into a pre-existing empty cell in the second table. The innerHTML property makes this simple.