Click here to Skip to main content
15,884,425 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
HTML
<HTML>
<HEAD>
    <TITLE> Add/Remove dynamic rows in HTML table </TITLE>

<link rel="stylesheet" type="text/css" href="style.css">
 
    <SCRIPT language="javascript">
      function addRow(tableID) {
            var table = document.getElementById(tableID);
			var rowCount = table.rows.length;
            var row = table.insertRow(rowCount);
			var colCount = table.rows[0].cells.length;
			for(var i=0; i < colCount; i++) {
			var newcell = row.insertCell(i), cellNode =null;
			newcell.innerHTML = table.rows[0].cells[i].innerHTML;
				cellNode = newcell.childNodes[0];
				switch(cellNode.type) {
					case "checkbox":
					cellNode.checked = false;
					cellNode.id = "checkBox_"+i;
					cellNode.></SCRIPT>

</HEAD>
<BODY>

<div class="createPerson">
    <h2> Add New Person </h2>
    <ul class="newPerson">
       <li class="liPerson">First Name:<input type="textbox" name="fName" /> </li>
        <br>
       <li class="liPerson">Last Name: <input type="textbox" name ="lName" /></li>
</div>


<br><br>

<div>

    <TABLE id="dataTable" cellspacing="0" borderspacing='1' style='border: solid 1px black'>
        <tr id="g">
         <TD><INPUT type="checkbox" name="chk" id='checkBox_0' onclick="highlight(document.getElementById('checkBox_0'), document.getElementById('g'))"  /></TD>
         <th id="fName">First Name</th>
         <th>Last Name</th>
        </tr>

    </TABLE>
    <INPUT type="button" value="Delete Checked People" class="btnDelete" onclick="deleteRow('dataTable')" />
    <INPUT type="button" value="Add Person" class="btnAdd" onclick="addRow('dataTable')" />
</div>

</BODY>
</HTML>
Posted
Updated 2-Dec-14 9:40am
v2
Comments
syed shanu 2-Dec-14 19:56pm    
Check this link :
http://stackoverflow.com/questions/4457607/javascript-inserting-data-into-html-table

http://stackoverflow.com/questions/20562718/add-data-to-table-using-onclick-function-in-javascript

http://www.redips.net/javascript/adding-table-rows-and-columns/
mudgilsks 5-Dec-14 8:15am    
What exactly are you asking? This is not clear.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900