CODEWITHSUNDEEP
jquery
ktm
ktm

Reputation: 6085

How to enable button when checkbox clicked in jQuery?

How to enable button when checkbox clicked in jQuery?

Upvotes: 24

Views: 36013

Answers (3)

Marcos Sánchez Urquiola
Marcos Sánchez Urquiola

Reputation: 281

If you are also using Bootstrap with Jquery, "disabled" is not an attribute but a class. So, (and I usually keep my functions on a separate loadable file to keep it clean) do this:

  1. Create whatever.js

  2. Put this code in it:

    function seethemagic(){ $('#btn-send').toggleClass('disabled'); }

  3. Load whatever.js into your html

  4. The button can look like this:

    <button id="btn-send" class="btn btn-primary d-grid w-100 disabled" onclick="seethemagic();">Show me the magic</button>

This way the button will toggle on and off.

Upvotes: 0

Nick Craver
Nick Craver

Reputation: 630607

You can do it like this:

$("#checkBoxID").click(function() {
  $("#buttonID").attr("disabled", !this.checked);
});

This enables when checked, and disables again if you uncheck. In jQuery .attr("disabled", bool) takes a boolean, so you can keep this pretty short using the this.checked DOM property of the checkbox.

Upvotes: 62

Tim
Tim

Reputation: 9489

$("#yourcheckboxid").click(function() {
    var checked_status = this.checked;
    if (checked_status == true) {
       $("#yourbuttonid").removeAttr("disabled");
    } else {
       $("#yourbuttonid").attr("disabled", "disabled");
    }
});

Upvotes: 5

Related Questions