Enable Disable TextBox on CheckBox selection in Table row using JavaScript

nehaadawa
 
on Oct 20, 2021 10:44 PM
275 Views

Hi,

How can i enable and disable particular textbox with respective checkbox being checked for entire table using javascript. 

Can anyone plz help with the code. 

Thanks

Download FREE API for Word, Excel and PDF in ASP.Net: Download
arjunv
 
on Oct 21, 2021 04:59 AM

Hi Nehaadawa.

  kindly refer below sample.

<table id="tblDetails">
    <tr>
        <td><asp:CheckBox runat="server" /></td>
        <td><asp:TextBox runat="server" Enabled="false"></asp:TextBox></td>
    </tr>
    <tr>
        <td><asp:CheckBox runat="server" /></td>
        <td><asp:TextBox runat="server" Enabled="false"></asp:TextBox></td>
    </tr>
</table>
<script type="text/javascript">
    window.onload = function () {
        var table = document.getElementById("tblDetails");
        var tbody = table.getElementsByTagName("tbody")[0];
        tbody.onclick = function (e) {
            var target = e.target || e.srcElement;
            if (target && target.type === "checkbox") {
                var tr = target.parentNode.parentNode;
                var elems = tr.getElementsByTagName("input");
                for (var i = 1; i < elems.length; i++) {
                    elems[i].disabled = target.checked ? false : true;
                }
            }
        }
    }
</script>

Screenshot