dynamic row creation

[sagardash]

Hi
can any one please help me in creating dynamic row...
like the bellow image.. i also past the code for it...

http://www.desiupload.com/out.php/i434250_addgroup.JPG (http://www.desiupload.com/show.php/434250_addgroup.JPG.html)


when ever we will press AddGroup ... it should create the same format again and again....

please help me...

<script type="text/javascript">
//var tab=document.getElementById('group_1');
function div_display(group_1)
{
//alert("sdf");
//document.getElementById('group_1').style.display='block';
//tab.style.display='block';
var foo = document.getElementById("group_1");

//Append the element in page (in span).
foo.appendChild();
}



</script>



<table width="950" height="220" border="0">
<tr>
<td height="214"><div id="group_1" > <!--style="display:none;"-->




<table width="966" height="209" border="0">

<tr>

<td colspan="2"><div id="group_name_1">
Group Name: <input type="text" name="textfield"></div></td>
<td width="308" height="55"><div id="group_stage_1">Group Stage:<select name="selRow0">
<OPTION value="in">Draft</OPTION>
<OPTION value="de">Negotiation</OPTION>
<OPTION value="fr">Delivered</OPTION>
<OPTION value="us">On Hold</OPTION>
<OPTION value="ch">Confirmed</OPTION>
<OPTION value="ch">Closed Accepted</OPTION>
<OPTION value="ch">Closed Lost</OPTION>
<OPTION value="ch">Closed Dead</OPTION>
</select></div></td>
<td width="270">&nbsp;</td>
</tr>
<tr>
<td width="71">
<div id="group_addrow_1"><input type="submit" name="Submit" value="Add Row"></div>

</td>
<td width="289"><div id="group_comm_1"><input type="submit" name="Submit" value="Add Comment"></div></td>
<td width="308" rowspan="4">&nbsp;</td>
<td><div id="group_subt_1">
Subtotal:
<input type="text" name="textfield">
</div></td>
</tr>
<tr>
<td colspan="2">&nbsp;</td>
<td height="23"><div id="group_tax_1">
Tax:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<input type="text" name="textfield">
</div></td>
</tr>
<tr>
<td colspan="2"></td>
<td><div id="group_ship_1">
Shipping:
<input type="text" name="textfield">
</div></td>
</tr>
<tr>
<td colspan="2"><div id="group_delete_1"><input type="submit" name="Submit" value="Delete Group"></div></td>
<td><div id="group_total_1">Total :&nbsp;&nbsp;&nbsp;&nbsp;
<input type="text" name="textfield">
</div></td>
</tr>




</table>
</div>
</td>
</tr>

<!--<tr>
<td>&nbsp;</td>
</tr>-->
</table>
<p>

<input type="button" name="Submit2" value="Add Group" onclick="div_display(group_1)" />

</p>
</body>
</html>

[Kor]

DOM methods:
http://www.howtocreate.co.uk/tutorials/javascript/domstructure

[sagardash]

i want to edit this thread how can i...
its old post so i am not seeing any edit option...
can any one please tell me how to edit or delete this post


THANKS