CODEWITHSUNDEEP
javascriptjqueryaddclass
Mike Vierwind
Mike Vierwind

Reputation: 1520

Change attr to class with jquery

I have this script:

$(document).ready(function() {
    $('#Checkout1').addClass('disabled');
    $('#voorwaarden').change(function() {
        $('#Checkout1').attr('disabled', $(this).is(':checked') ? null : 'disabled');
    });
});

The script is no change the attr disabled. But how can i change this script to this thing. When you change the #voorwaarden. Than remove the class diabled from #checkout1. And when i changed next the #voorwaarden. Than add class and going furter and furter. #voorwaarden is an checkbox.

Thanks!

Upvotes: 0

Views: 161

Answers (2)

Ron
Ron

Reputation: 2790

Simply do with toggleClass()

$(document).ready(function() {
    $('#Checkout1').addClass('disabled');
    $('#voorwaarden').change(function() {
        $('#Checkout1').toggleClass('disabled');
    });
});

Note: http://api.jquery.com/toggleClass/

Edited: In case that you want to toggle 'disabled' property, 

$(document).ready(function() {
    $('#Checkout1').prop('disabled', true);
    $('#voorwaarden').change(function() {
        $('#Checkout1').prop('disabled', !$('#Checkout1').prop('disabled'));
    });
});

Upvotes: 2

T.J. Crowder
T.J. Crowder

Reputation: 1074929

I'm not entirely sure I understand your question, but if your goal is to add the class "disabled" when the checkbox is not checked, and remove it when it is, then:

$(document).ready(function() {
    $('#Checkout1').addClass('disabled');
    $('#voorwaarden').change(function() {
        $('#Checkout1').toggleClass('disabled', !this.checked);
    });
});

toggleClass will add the class if the flag is true, or remove it if the flag is false.

Upvotes: 0

Related Questions