<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<meta http-equiv= "Content-type" content= "text/html; charset=gb2312 "/>
<title> Add Table rows dynamically </title>
<body>
<style type= "Text/css" >
<!--
td{width:300px;text-align:center;margin:0px;padding:0px}
-
</style>
<script language= "javascript" type= "Text/javascript" >
<!--
Function Show () {
var Num=document.getelementbyid ("Test"). getElementsByTagName ("input") [0].value;
var y=parseint (num);
for (Var i=0;i<y;i++) {
var strs= ' <table cellpadding= "0" cellspacing= "0" border= "1px solid black" ><tr><td><select style= "WIDTH:102PX" ><option> Select product number </option></select></td><td><input type= "text" Style= "width:99px"/></td><td><input type= "text" style= "width:100px"/> (digital) </td><td ><input type= "text" style= "width:100px"/></td></tr></table> ";
document.getElementById ("Change"). Innerhtml+=strs;
}
}
-
</script>
<div id= "Test" >
Number of products added: <input type= "text" name= "text" value= ""/>
<input type= "button" name= "Submit" value= "Generate input Box" onclick= "Show ()"/>
</div>
<table cellpadding= "0" cellspacing= "0" border= "1px solid #ccc" >
<tr style= "Background-color: #009999" >
<td> Product Code </td>
<td> Product Name </td>
<td> Quantity </td>
<td> Unit Price </td>
</tr>
</table>
<div id= "Change" >
</div>
</body>
JS Dynamic Add Table