Rick Kap
Rick Kap

Reputation: 159

Enable/disable checkbox determind by users input

I've got a simple form where the user enters his contact number. If the contact number starts with 07 then the checkbox is enabled anything else I need it to be disabled.

I have written some code but the problem I face is when the user types 01 then it's disabled but if they then go on to add any other numbers after the 01 the checkbox becomes enabled.

function deselectcheckbox(wildvalue) {
  if (document.getElementById("1").value == "01") {
   $("#checkbox").attr("disabled", true);
   document.getElementById("divText").innerHTML = "Not able to send";
  }
  else
   {
   $("#checkbox").attr("disabled", false);
   document.getElementById("divText").innerHTML = "Send text";
  }
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<table>
<tr>
 <td>Contact Number</td>
 <td><input type="text" id="1" name="1" onkeyup="deselectcheckbox(this.value)"></td>
</tr>
<tr>
 <td><label><div id="divText">Send text</div></label></td>
 <td><input type="checkbox" name="contact" id="checkbox" value=""></td>
</tr>
</table>

I've tried adding a wildcard to

(document.getElementById("1").value == "01*")

But it's not working, Please help

Upvotes: 4

Views: 243

Answers (1)

IrkenInvader
IrkenInvader

Reputation: 4050

If you only want the checkbox to be enabled when the content starts with "07" you can check for that first and disable inside of the else block.

  if (document.getElementById("1").value.startsWith("07")) {
    $("#checkbox").attr("disabled", false);
    document.getElementById("divText").innerHTML = "Send text";
  }
  else
  {
    $("#checkbox").attr("disabled", true);
    document.getElementById("divText").innerHTML = "Not able to send";
  }

Upvotes: 5

Related Questions