Add delete row java script

Add delete row java script

Below demo is to show how to add input field dynamically by java script

  • To add and delete rows you could use below java script codeĀ and test it here:
<!DOCTYPE html>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
        function addRowToTable(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";

            var cell2 = row.insertCell(1);
            cell2.innerHTML = rowCount + 1;

            var cell3 = row.insertCell(2);
            var element2 = document.createElement("input");
            element2.type = "text";
            var length=(table.rows.length)-1;
   = "operationParameterses["+length+"].name";


        function deleteRowFromTable(idOfTable) {
            try {
            var table = document.getElementById(idOfTable);
            var totalRowCount = table.rows.length;

            for(var i=0; i<totalRowCount; i++) {
                var row = table.rows[i];
                var chkbox = row.cells[0].childNodes[0];
                if(null != chkbox && true == chkbox.checked) {
            }catch(e) {}


    <h2>User Details</h2>

    <input type="button" value="Add Rows" onclick="addRowToTable('tableId')" style="background: yellow;padding: 5px;">
    <input type="button" value="Delete Row" onclick="deleteRowFromTable('tableId')" style="background: yellow;padding: 5px;">
    <TABLE id="tableId" width="350px" border="5px">
            <TD ><INPUT type="checkbox" name="checkbox" /></TD>
            <TD><INPUT type='text' name="operationParameterses[0].name" /></TD>

  • Open html file in any browser. You wil see below.Click Add Row button to add or Select check-box to and Click Delete Row to delete Row.



Leave a Reply

Your email address will not be published. Required fields are marked *

I am not Robot *