Dynamic row genertion in javascript?
View Answers
September 4, 2009 at 3:50 PM
Hi Friend,
Use the following code:
<html>
<head>
<script LANGUAGE="JavaScript">
function addRow(tableID){
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
var row = table.insertRow(rowCount);
var cell1 = row.insertCell(0);
var element1 = document.createElement("input");
element1.type = "text";
cell1.appendChild(element1);
var cell2 = row.insertCell(1);
var element2 = document.createElement("input");
element2.type = "text";
cell2.appendChild(element2);
var cell3 = row.insertCell(2);
var element3 = document.createElement("textarea");
element3.setAttribute("name","mytextarea");
element3.setAttribute("cols","10");
element3.setAttribute("rows","1");
cell3.appendChild(element3);
}
</script>
</head>
<body>
<form name="f1" id="f1">
<input type="button"value="Add" onclick="addRow('datatable')">
<table id="datatable" cellspacing="0" border="1">
<tbody>
<tr>
<td><input type="text" ></td><td><input type="text"></td><td><textarea rows="1" cols="20"></textarea></td>
</tr>
</tbody>
</table>
</form>
</body>
</html>
Thanks
Use the following code:
<html>
<head>
<script LANGUAGE="JavaScript">
function addRow(tableID){
var table = document.getElementById(tableID);
var rowCount = table.rows.length;
var row = table.insertRow(rowCount);
var cell1 = row.insertCell(0);
var element1 = document.createElement("input");
element1.type = "text";
cell1.appendChild(element1);
var cell2 = row.insertCell(1);
var element2 = document.createElement("input");
element2.type = "text";
cell2.appendChild(element2);
var cell3 = row.insertCell(2);
var element3 = document.createElement("textarea");
element3.setAttribute("name","mytextarea");
element3.setAttribute("cols","10");
element3.setAttribute("rows","1");
cell3.appendChild(element3);
}
</script>
</head>
<body>
<form name="f1" id="f1">
<input type="button"value="Add" onclick="addRow('datatable')">
<table id="datatable" cellspacing="0" border="1">
<tbody>
<tr>
<td><input type="text" ></td><td><input type="text"></td><td><textarea rows="1" cols="20"></textarea></td>
</tr>
</tbody>
</table>
</form>
</body>
</html>
Thanks
Related Tutorials/Questions & Answers:
Advertisements
Ads
