Kung Fu Ninja
Kung Fu Ninja

Reputation: 3752

jquery checkbox issue - do not check if it's disabled

I have 5 checkboxes in each row. The first one is 'ALL'. I am trying to see if any of the others are disabled. So, if somebody clicks on 'ALL' checkbox, I need to make sure the disabled ones are not checked. This is what I have:

("input[name^=all_]").each(function() {
var input = $(this);   
var name = input.attr('name');    
var num = /\d+$/.exec(name)[0]; 
$(this).click(function() {

if ($('"#G"+num').attr('disabled',false)) {            
$("#G"+num).attr('checked', $("#all_"+num).is(':checked'));
}
if ($('"#E"+num').attr('disabled',false)) {         
$("#E"+num).attr('checked', $("#all_"+num).is(':checked'));
}
if ($('"#W"+num').attr('disabled',false)) {
$("#W"+num).attr('checked', $("#all_"+num).is(':checked'));
}
if ($('"#S"+num').attr('disabled',false)) {
$("#S"+num).attr('checked', $("#all_"+num).is(':checked'));
}
});

});

The thing is, the disabled ones still gets checked once I click on 'ALL'. what am i doing wrong? thanks in advance.

Upvotes: 15

Views: 43902

Answers (9)

Bilal Khan
Bilal Khan

Reputation: 141

I have done it on this way.

<label class="checkbox-inline">
<input type="checkbox" id="check-all">
<span style="font-weight: bold">Check All</span>
</label>


<script type="text/javascript">
    $("#check-all").click(function () {
        $('input:checkbox').not(this).prop('checked', this.checked);
        $('input:checkbox:not(:enabled)').removeAttr('checked');
    });
</script>

Upvotes: 0

Drew
Drew

Reputation: 1452

I know this is an old post, but I had another similar take on it where I wanted to check all check boxes that were not disabled. However, I also have a few other checkboxes that I don't want affected by this, so I needed to target just the <div> that contained them:

$(function () {
    $('#checkAll').click(function () {
        $('#completed_modules').find(':checkbox:not(:disabled)').attr('checked', this.checked);
    });
});

Works like a charm. Enjoy, I hope someone finds this useful.

Upvotes: 1

Serjas
Serjas

Reputation: 2284

To check all except disabled

$('input:checkbox:not(:disabled)').attr('checked','checked');

To uncheck all except disabled

$('input:checkbox:not(:disabled)').removeAttr('checked');

Upvotes: 10

cik_imo
cik_imo

Reputation: 11

I've got the same problem, but I managed to solve it & I think the solution is fine. Here:

$("INPUT[@name="+children+"][type='checkbox']").attr('checked', $(parent).is(':checked'));
$("INPUT[@name="+children+"][type='checkbox'][disabled]").attr('checked', false);

I think it's easy to understand. No need to explain further, I guess :P But please don't hesitate to ask :)

Upvotes: 1

Rwakos
Rwakos

Reputation: 91

Try this:

var all_checks = 0;

$(document).ready(function(){
    $("#all").click(function(){ 
    $('input:checkbox:not(:disabled)').attr("checked",!(all_checks==1));
         if (all_checks == 0){all_checks=1;} else {all_checks = 0;};
    });
});

Where #all is the ID of the master checkbox (which says Check/Uncheck All...

Hope this helps somebody! Richard Reveron

Upvotes: 2

uji
uji

Reputation: 1633

umm i would probably do this:


    $('input[name=all]').click(function(){
        var classn = $(this).attr('class');
        $('.'+classn+':not(:disabled)').attr('checked', $(this).is(':checked'));
    });

just assign a uniform class for every row say row_one, row_two and so on.

Upvotes: 3

Ray
Ray

Reputation: 370

It might be better UI to use a toggle button to "check all/uncheck all" instead of a checkbox for "ALL". So 1 button + 4 checkboxes instead of 5 checkboxes. Then you won't have to mess with disabling.

Upvotes: 1

Kung Fu Ninja
Kung Fu Ninja

Reputation: 3752

this works:

 if ( !$("#G"+num).is(':disabled') ) {             
$("#G"+num).attr('checked', $("#all_"+num).is(':checked'));
}
if ( !$("#E"+num).is(':disabled')) {            
$("#E"+num).attr('checked', $("#all_"+num).is(':checked'));
}
if ( !$("#W"+num).is(':disabled') ) {
$("#W"+num).attr('checked', $("#all_"+num).is(':checked'));
}
if (!$("#S"+num).is(':disabled')) {
$("#S"+num).attr('checked', $("#all_"+num).is(':checked'));
}
});

Upvotes: 17

Doug Domeny
Doug Domeny

Reputation: 4470

Use jQuery's ":disabled" filter instead of accessing the 'disabled' attribute.

Upvotes: 5

Related Questions