Quantcast
Channel: Active questions tagged row - Stack Overflow
Viewing all articles
Browse latest Browse all 445

How to insert row with attributes using table.insertRow?

$
0
0

I have a html table and insert a new row with table.insertRow(), but the new row doesn't have any attributes or formatting applied. How can I add a row to the table with row formatting?

<INPUT type="button" value="Add Row" onclick="addRow('dataTable')" /><INPUT type="button" value="Delete Row" onclick="deleteRow('dataTable')" /><TABLE id="dataTable" width="100%" align="center"><TR align="center" border="1"><TH></TH><TH>ID </TH><TH>Name</TH><TH>Status</TH></TR><TR align="center"><TD><INPUT type="checkbox" name="chk"/></TD><TD> 1 </TD><TD> <INPUT type="text" value="Submission 1" /> </TD><TD>Working version</TD></TR></TABLE><script type="text/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 = "checkbox";        cell1.appendChild(element1);        var cell2 = row.insertCell(1);        cell2.innerHTML = rowCount;        var cell3 = row.insertCell(2);        var element2 = document.createElement("input");        element2.type = "text";        cell3.appendChild(element2);    }    function deleteRow(tableID) {        try {        var table = document.getElementById(tableID);        var rowCount = table.rows.length;        for(var i=0; i<rowCount; i++) {            var row = table.rows[i];            var chkbox = row.cells[0].childNodes[0];            if(null != chkbox && true == chkbox.checked) {                table.deleteRow(i);                rowCount--;                i--;            }        }        }catch(e) {            alert(e);        }    }</script>

Viewing all articles
Browse latest Browse all 445

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>