Disable submit button if checkbox is not checked in jquery

Question

I have looked on here and tried every answer available, but it is still not working for me. I am trying to disable the submit button if checkbox is not checked. Here is my jquery:

var userTerms = $('input#agree');
     if(userTerms.is(':checked')) {
        $("#aggtxt").addClass("err");
        $("#aggtxt").removeClass("error");
        $("#aggtxt").text(" Agreed");
        $("#bookit").attr('disabled', false);
        }else{
        $("#aggtxt").removeClass("err");
        $("#aggtxt").addClass("error");
        $("#aggtxt").text(" Please check terms and conditions box");
        $("#bookit").attr('disabled', true);
        }

         if ($('#bookit').is(':disabled') == true) { 
            $("#booktxt").removeClass("err");
            $("#booktxt").addClass("error");
            $("#booktxt").text(" Before you can submit this form please check the errors in form marked in red.");
            }else{
                $("#booktxt").addClass("err");
                $("#booktxt").removeClass("error");
                $("#booktxt").text(" Your information looks good, continue to booking...");
                }   
});

and part of my HTML form:

<p><span id="aggtxt"></span><br /><input type="checkbox" name="agree" id="agree" />  I agree to <a href="http://travel.ian.com/index.jsp?pageName=userAgreement&locale=en_US&cid=379849" target="_blank">Terms and Conditions</a> and understand Cancellation Policy.<p>
<span id="booktxt"></span>
<input type="submit" name="bookit" value="" class="bookit" id="bookit" />

Paz Aricha · Accepted Answer · 2012-07-03 12:38:17Z

12

My take on this:

http://jsfiddle.net/bluz/peans/

Hope this helps :) Paz.

answered Jul 3, 2012 at 12:38

Paz Aricha

4081 gold badge5 silver badges14 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Vaibhav Bhanushali Over a year ago

u havent used "Var" to declare a variable in ur script this is the correct one jsfiddle.net/peans/39

Ilia Frenkel · Accepted Answer · 2012-04-13 01:34:52Z

2

Try this:

$("#bookit").attr('disabled', 'disabled');

I tried this:

<input type="checkbox" name="agree" id="agree" onclick="$('#bookit').attr('disabled', !$(this).is(':checked'));" />
    I agree to <a href="http://travel.ian.com/index.jsp?pageName=userAgreement&locale=en_US&cid=379849" target="_blank">Terms and Conditions</a> and understand Cancellation Policy.<p>

And it disables the button if you uncheck the checkbox.

edited Apr 13, 2012 at 1:34

answered Apr 13, 2012 at 1:11

Ilia Frenkel

1,98714 silver badges20 bronze badges

2 Comments

elclanrs Over a year ago

New hotness!! $el.prop('disabled', true)

luv2code Over a year ago

the disabled button code works fine, cause I also have it with other parts of the form.. it is only failing when I check if check box is checked.

Community · Accepted Answer · 2020-06-20 09:12:55Z

0

Try this:

if($('#agree').val() == 'true')

1 Comment

SIFE Over a year ago

@liveandream I corrected it now, you should test whether the checkbox is checked or not .

Collectives™ on Stack Overflow

Disable submit button if checkbox is not checked in jquery

3 Answers 3

1 Comment

2 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related