CODEWITHSUNDEEP
javascriptjqueryclasscheckboxclick
mr12086
mr12086

Reputation: 1147

Checking the checked status of a checkbox upon its click

I am trying to test the status of a checkbox upon its click.

My problem is that it always reports as true as it reports the status after the change event has taken place and not before.

Is there anyway I can test before the change.

Current code using jQuery - the checkboxes all of class 'package':

$(".package").click(function(){
    if($(this).is(":checked")){
        alert($(this).attr("checked"));
    }
});

This always returns true even if selecting a checkbox that is not currently checked.

EDIT : Ok seems there was some old js interfering with the process, after cleaning that up the click function did indeed work. Thanks all.

Upvotes: 2

Views: 573

Answers (3)

Mathew Thompson
Mathew Thompson

Reputation: 56429

The click event fires before the actual textbox change takes place, you need to subscribe to the change event:

$(".package").change(function(){
    if($(this).is(":checked")){
        alert($(this).attr("checked"));
    }
});

Edit: Try querying the actual Javascript object itself, should work

$(".package").change(function(){
    if(this.checked){
        alert(this.checked);
    }
});

Upvotes: 1

Florian Margaine
Florian Margaine

Reputation: 60767

Using the onchange event on a checkbox is not cross-browser (hello IE! And yes, even with jQuery).

The following works:

$('.package').click(function() {
    console.log(this.checked) // There is no need for jQuery here
})

Logs 'true' when you check the checkbox, and 'false' when you uncheck it.

And seriously, using $(this).attr('checked') or $(this).is(':checked') is just jQueryception for nothing.

Upvotes: 2

huysentruitw
huysentruitw

Reputation: 28131

You can use the change event instead, this way you are sure the previous checked state is always the oposite of what you read now

$(".package").change(function() {
    alert($(this).attr("checked"));
});

Upvotes: 1

Related Questions