How to disable textbox depending on checkbox checked

Question

Can anyone please tell me how to disable a textbox, if a checkbox is checked, and enable textbox if the checkbox is not checked?

Answer 1

Put this in the checkbox:

onclick="document.getElementById('IdOfTheTextbox').disabled=this.checked;"

Answer 2

    <input type="text" id="textBox">
    <input type="checkbox" id="checkBox" onclick="enableDisable(this.checked, 'textBox')">
    <script language="javascript">
    function enableDisable(bEnable, textBoxID)
    {
         document.getElementById(textBoxID).disabled = !bEnable
    }
</script>

Answer 3

jQuery(document).ready(function () {
   $("#checkBox").click(function () {
      $('#textBox').attr("disabled", $(this).is(":checked"));
   });
});

Answer 4

Create a Javascript function like this:

function EnableTextbox(ObjChkId,ObjTxtId)
{

    if(document.getElementById(ObjChkId).checked)
        document.getElementById(ObjTxtId).disabled = false;
    else
        document.getElementById(ObjTxtId).disabled = true;
}

Create a C# function like this on the grid RowDataBound:

protected void lstGrid_RowDataBound(object sender, GridViewRowEventArgs e)
{
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        TextBox txtAllowed = (TextBox)e.Row.FindControl("txtAllowed");

        CheckBox chkAllowed = (CheckBox)e.Row.FindControl("RowSelector");
        chkAllowed.Attributes.Add("onClick", "EnableTextbox('" + chkAllowed.ClientID + "', '" + txtAllowed.ClientID + "')");
    }
}

Answer 5

I have the simplest solution yet for this Simple task. Believe me or not it works

s = 1;
   function check(){
       o = document.getElementById('opt');
       if(o.value=='Y'){
           s++;
           if(s%2==0)
           $('#txt').prop('disabled',true);
           else
           $('#txt').prop('disabled',false);
       }
       
   }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Text: <input type="text" name="txt" id="txt">
<input type="checkbox" name="opt" id="opt" value="Y" onclick="check()">

Here is code.

Answer 6

<script type="text/javascript">
    function EnableDisableTextBox(chkPassport) {
        var txtPassportNumber = document.getElementById("txtPassportNumber");
       txtPassportNumber.disabled = chkPassport.checked ? false : true;
        if (!txtPassportNumber.disabled) {
            txtPassportNumber.focus();
        }
    }
</script>
<label for="chkPassport">
<input type="checkbox" id="chkPassport" onclick="EnableDisableTextBox(this)" />
Do you have Passport?
</label>
<br />
Passport Number:
<input type="text" id="txtPassportNumber" disabled="disabled" />

Answer 7

Using jQuery:

$("#checkbox").click(function(){
  $("#textbox")[0].disabled = $(this).is(":checked");
});