In the below code i have html table in which i need to add row to html table and insert into database .But I couldn't add row.Pls help me to rectify the issue.My aim is to avoid postback so i choose javascript to add row .

<script language="javascript">        
    function addRow(tableID) {
            var table = document.getElementById("<%=dataTable.ClientID%>").value; 
    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); 
newcell.innerHTML = table.rows[0].cells[i].innerHTML; 
switch (newcell.childNodes[0].type) { 
case "text": newcell.childNodes[0].value = ""; 
break; case "checkbox": newcell.childNodes[0].checked = false; 
break; case "select-one": newcell.childNodes[0].selectedIndex = 0; break; } } }
        function deleteRow(tableID) {
            try {
                var table = document.getElementById("<%=dataTable.ClientID%>"); 
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) {
                        if (rowCount <= 1) { alert("Cannot delete all the rows."); break; }
                        table.deleteRow(i); rowCount--; i--;
                    } 
                } 
            } catch (e) { alert(e); } 
        }</script>



  <input type="button" value="Add Row" onclick="addRow('dataTable')"/>

    <input type="button" value="Delete Row" onclick="deleteRow('dataTable')"/>

    <table id="dataTable" width="350px" border="1" runat="server">
        <tr>
            <td><input type="checkbox" name="chk" runat="server"/></td>
            <td><input type="text" name="txt" runat="server"/></td>
            <td>
                 <asp:DropDownList ID="ddlProduct" runat="server" OnSelectedIndexChanged="ddlProduct_SelectedIndexChanged"  AutoPostBack="true" Style="width: 100%; height:23px" ></asp:DropDownList>
            </td>
        </tr>
    </table>

Related posts

Recent Viewed