Member Avatar for abim usman 
    function EnableDisableTextBox(chkPassport) {
        var txtPassportNumber = document.getElementById("txtPassportNumber");
        txtPassportNumber.disabled = chkPassport.checked ? false : true;
        if (!txtPassportNumber.disabled) {
            txtPassportNumber.focus();
        }
    }


<html>
<body>
<label for="chkPassport">
    <input type="checkbox" id="chkPassport" onclick="EnableDisableTextBox(this)" />
    Tab?
</label>Tab Quantity:
<input type="text" id="txtPassportNumber" disabled="disabled" />
<br>
<script type="text/javascript"></script>

<label for="shoes">
    <input type="checkbox" id="shoes" onclick="EnableDisableTextBox(this)" />
    Shoes?
Shoes Quantity:
<input type="text" id="txtquant" disabled="disabled" />


<br />
<label for="tshirt">
    <input type="checkbox" id="tshirt" onclick="EnableDisableTextBox(this)" />
    Tshirt?
</label>
Tshirt Quantity:
<input type="text" id="polo" disabled="disabled" />
</body>
</html>
  • 2 Contributors
  • 1 Reply
  • 1K Views
  • 1 Week Discussion Span
  • Latest Post Latest Post by kgweb
Member Avatar for kgweb

You have not been very clear about what you want to happen, but it seems to me that because you get a reference to the text element by "txtPassportNumber" in your code, the only text box that you will ever change is the first one. The other two start off and always remain disabled.

I presume that you need to change the code so that if, for example, the second checkbox is checked then the second text field is enabled (you would need to get a reference to this text element by "txtquant") and you would disable the other text fields.

If this is not what you want to happen then please explain the problem in more detail.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.