CODEWITHSUNDEEP
jqueryhtml
CLOUDS
CLOUDS

Reputation: 31

Jquery Button disabled and enabled when checkbox clicked

I am new to html and Jquery I am trying to create a project where in first I disable my Jquery Button first but when checkbox clicked it will be enabled however my code below is not working. The button is not disable always enable even my checkbox is uncheck. I would really appreciate any suggestion and help. Thanks a lot.

function goFurther() {
  if (document.getElementById("chkAgree").checked == true) {
    $("#submit").disabled = false;
    $("#cancel").disabled = false;  
  } else {
    $("#submit").disabled = true;
    $("#cancel").disabled = true;
  }
}
input[disabled] {
  color: gray;
  text-decoration: none;
}
<form>
  <input type="checkbox" id="chkAgree" onclick="goFurther()">I agree.
  <br><br>
</form>

Upvotes: 0

Views: 111

Answers (2)

MyTwoCents
MyTwoCents

Reputation: 7622

There are many ways to disable checkbox with and without jquery like 

document.getElementById("test").disabled= true;
$("#test").prop('disabled', true);
$("#test").attr('disabled', true);

Upvotes: 0

31piy
31piy

Reputation: 23869

You cannot set disabled on a jQuery wrapped element. Use prop() for it:

$("#submit").prop('disabled', false); // To enable the button
$("#submit").prop('disabled', true); // To disable the button

Alternatively, you can get the native DOM elements out of the jQuery wrapper using get() and then assign disabled:

$("#submit").get(0).disabled = false; // To enable the button
$("#submit").get(0).disabled = true; // To disable the button

Upvotes: 2

Related Questions