Dynamically Duplicating Table Row [Archive]

kathycam

02-17-2012, 02:54 PM

Hi

I have create a table with 1 row and when the user clicks the "Add Row" button, the row is added to the bottom of the table.

I just can't figure out how to do it.

Attached attempt at coding it :)

Thank you.

vwphillips

02-17-2012, 03:35 PM

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
<title></title>
<script type="text/javascript">

function AddRow(obj){
var tr,tbdy;
while (obj.parentNode&&!tr){
if (obj.nodeName.toUpperCase()=='TR'){
break;
}
obj=obj.parentNode;
}
obj.parentNode.appendChild(obj.cloneNode(true));
}

</script>

</head>

<body>
<table border="1">
<tbody>
<tr>
<td><input type="button" name="" value="New Row" onmouseup="AddRow(this);"/></td>
</tr>
</tbody>
</table>

</body>

</html>