View Full Version : Remove & appendChild

02-09-2003, 06:15 PM
I have some code that has a select list with values from 0-10 that when selected passes the selected value to a function that adds the correct # of rows to the table. The problem I'm having trouble with is replacing the existing table with the new table. Can anyone advise me the proper way to do this?

Code below

<script language="javascript">
Trying to figure out how to remove previously added rows and

replace with new value
passed into function OR completely remove table if value is '0'.
function AddRow(noRows)

var vTrgTbl = window.document.getElementById('rowTable');
var vSrcTbl = window.document.getElementById('Row1');
var i;

for (var i = 0; i < noRows; i++)
var vRow = vSrcTbl.lastChild.firstChild.cloneNode(true);


<form method="post" name="testForm">
<table width="100%" border="0" cellspacing="0" cellpadding="2"


<td width="32%">&nbsp;Total rows in table:</td>
<td width="68%">
<select name="rows" size="1"

<option value="0" selected>0</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
</table><table width="100%" border="0" cellspacing="0"

cellpadding="2" class="content" id="rowTable">


<div style="visibility:hidden">
<table id="Row1">
<td><input type="text" name="name"></td>
<td><input type="text" name="relationship"></td>
<td><input type="text" name="age" size="3"></td>