I want to update the counter number in order even though delete row
right now my code like 1,2,3,4,5 After I delete the row. 1,2,4,5
so after i delete one of rows it will update Button name for all rows, so that I can insert values to Sql server using array.
<input name="Table[0].Item_name" style="width: 250px;height: 30px;"> 
<input name="Table[1].Item_name" style="width: 250px;height: 30px;"> 
<input name="Table[2].Item_name" style="width: 250px;height: 30px;"> 
<input name="Table[3].Item_name" style="width: 250px;height: 30px;"> 
<input name="Table[4].Item_name" style="width: 250px;height: 30px;">
id i delete Table[2], i want to update all Name values in order. like that:
<input name="Table[0].Item_name" style="width: 250px;height: 30px;"> 
<input name="Table[1].Item_name" style="width: 250px;height: 30px;"> 
<input name="Table[2].Item_name" style="width: 250px;height: 30px;"> 
<input name="Table[3].Item_name" style="width: 250px;height: 30px;">
 
<h1>Physical Inventory Count</h1>
UPC :
<input type='text'  name="fname" id="fname"  />
<br />
<br />
QTY :
<input type='text' name="lname" id="lname" value="1" />
<br />
<br />
<br />
<br />
<input type='button' id='btnSubmit' onclick="addRow();" Value=' Submit' />
<br />
<br />
<br />
<table border="1" style="font-size:14px;" id="add-row">    
        <tr>
            <th style="width:90%; text-align:center">UPC </th>
            <th style="width:90%; text-align:center">QTY</th>
        </tr>
</table>
@section Scripts {
    <script type="text/javascript">
        $(document).ready(function () {
            $('input:text:first').focus();
            $('input:text').bind("keydown", function (e) {
                var n = $("input:text").length;
                var input = document.getElementById('lname');
                if (e.which == 13) { //Enter key
                    e.preventDefault(); //to skip default behavior of the enter key
                    var nextIndex = $('input:text').index(this) + 1;
                    if (nextIndex < n) {
                        $('input:text')[nextIndex].focus();
                        $('input:text')[nextIndex].select();
                    }
                    else {
                        $('input:text')[nextIndex - 1].blur();
                        $('#btnSubmit').click();
                        $('input:text:first').focus();
                    }
                }
            });
            $('#btnSubmit').click(function () {
                alert('Form Submitted');
            });
        });            
        var counter = 0;
        function addRow() {
            // get input values
            var fname = document.getElementById('fname').value;
            var lname = document.getElementById('lname').value;
            
            var newElem = document.createElement('input');
   
            // get the html table
            // 0 = the first table
            var table = document.getElementsByTagName('table')[0];
            // add new empty row to the table
            // 0 = in the top 
            // table.rows.length = the end
            // table.rows.length/2+1 = the center
            var newRow = table.insertRow(table.rows.length / 100 + 1);
            // add cells to the row
            var cel1 = newRow.insertCell(0);
            var cel2 = newRow.insertCell(1);
            var newCell = newRow.insertCell(2);
            // add values to the cells
            cel1.innerHTML = fname;
            cel2.innerHTML = lname;
            document.getElementById("fname").value = "";
            document.getElementById("lname").value = "1";
            newElem = document.createElement('input');
            newElem.setAttribute("type", "button");
            newElem.setAttribute("name", "COUNT" + counter);
            newElem.setAttribute("value", "Delete Row");
            newElem.setAttribute("onclick", 'SomeDeleteRowFunction(this)')
            newCell.appendChild(newElem);
            counter++; // I want to update this Counter number in order.
        }
        window.SomeDeleteRowFunction = function SomeDeleteRowFunction(o) {
            var p = o.parentNode.parentNode;
            p.parentNode.removeChild(p);
           
        }       
    </script>