Jump to content

how to disable textbox if the checkbox is not checked yet


fredowinz23

Recommended Posts

Something like this?

 

<input id='myCheckBox' type='checkbox' onclick='tehFunc();' /> <br />
<input id='myTextArea' type='text' disabled  />

<script>
function tehFunc() { document.getElementById("myTextArea").disabled = false; }
</script>

That script is not complete. It will enable the text field when the checkbox is first checked, but will not disable the field when it is unchecked. I would also add functionality to clear the value in the text field when the checkbox is unchecked. Try this:

 

<html>
<head>
<script type="text/javascript">

  function enableText(checkBool, textID)
  {
    textFldObj = document.getElementById(textID);
    //Disable the text field
    textFldObj.disabled = !checkBool;
    //Clear value in the text field
    if (!checkBool) { textFldObj.value = ''; }
  }

</script>
</head>

<body>
  <input id="myCheckBox" type="checkbox" onclick="enableText(this.checked, 'myTextArea');" />
  <br />
  <input id="myTextArea" type="text" disabled="disabled"  />
</body>
</html>

That script is not complete. It will enable the text field when the checkbox is first checked, but will not disable the field when it is unchecked. I would also add functionality to clear the value in the text field when the checkbox is unchecked. Try this:

 

<html>
<head>
<script type="text/javascript">

  function enableText(checkBool, textID)
  {
    textFldObj = document.getElementById(textID);
    //Disable the text field
    textFldObj.disabled = !checkBool;
    //Clear value in the text field
    if (!checkBool) { textFldObj.value = ''; }
  }

</script>
</head>

<body>
  <input id="myCheckBox" type="checkbox" onclick="enableText(this.checked, 'myTextArea');" />
  <br />
  <input id="myTextArea" type="text" disabled="disabled"  />
</body>
</html>

 

Good call. :)

  • 2 months later...

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.