How can i create a table and add rows

Hi Roma,

check this one ..this shld meet your req ..

<head>

<script type="text/javascript">

var Slno =0;

function getSlNO()
{
if((Slno == 0) || (Slno <2 ))
{
return ++Slno;
}
}
function addRow()
{
if( Slno <2 )
{
   var tbody = document.getElementById("itemTOBill").getElementsByTagName("tbody")[0];
   var row = document.createElement("TR");
   var cell1 = document.createElement("TD");
   cell1.innerHTML = getSlNO() ;
   var cell2 = document.createElement("TD");
   cell2.innerHTML =" <input type='text' name='ItemName'>";

   var cell3 = document.createElement("TD");
   cell3.innerHTML = " <input type='text' name='ItemQnty' size ='10'>";
   row.appendChild(cell1);
   row.appendChild(cell2);
   row.appendChild(cell3);
   tbody.appendChild(row);
   }
   else
{
alert("Connot order more than 2 items...");
}
}
function deleteRow()
{
if(Slno > 0)
{
   document.getElementById('itemTOBill').deleteRow(Slno);
   --Slno;
   }
   else
      alert("No item to Delete .. ");
}

</script>
</head>
<body class="tundra">
<form name="homePage" method="get" action=" ">
<div id='tester'dojoType="dojo.data.ItemFileReadStore" jsId="stateStore" url="states.txt" align="center">
<table width="2" border="1" id="itemTOBill">
<tbody>
<tr>
<td nowrap align="center"><font size="-2" face="Comic Sans MS" color="green"><i>Sl.No.</i></font>                   </td>
<td nowrap align="center" valign="middle"><font face="Comic Sans MS" size="-2">ProductName</font></td>
<td nowrap align="center" valign="middle"><font face="Comic Sans MS" size="-2"><i>Quantity</i></font></td>
</tr>
</tbody>
</table>

<font size="-1">
   <input type="button" value="Subimt" onclick="">
   <input type="button" value="Add" onclick=" addRow()" align="right">
   <input type="button" value="Delete" onclick="deleteRow()" align="right">
   </font> </div>


</form>
</body>

Search

How can i create a table and add rows

Dynamically add and delete rows to table in html & javascript