How to uncheck a checkbox when checked option is other than 'All'

Question

I've multiple checkboxes which are populated from database, except one checkbox which is "All" (used to check/uncheck all other checkboxes onclick)

When all the options are checked and if any option other than 'All' is unchecked then checkbox of All should be unchecked.
When all the option are checked except 'All' then 'All' should be checked. How to proceed?

My code:

<script>
    $(document).ready(function () {
        ('#check').append('<input type="checkbox"  id="checkAll" name="myCheckbox[]" value="All" > </input>' + "All" );
        //'datadb' is data from db in json array 
        //datadb={'apple','banana','orange'}

        $.each(datadb, function(i, fruit) {
            $('#check').append('<input type="checkbox" name="myCheckbox[]" class=".chk"  value="' + fruit + '" > </input>' + fruit );
            $('#check').append('<br/>');        
        }
    });
</script>

<script>            
    $(document).ready(function() {
        $("#checkAll").click(function () {
            $('input:checkbox').not(this).removeProp('checked');
        });
    });
</script>

<div id="check" onchange="testingclick()"></div>

How to fill the function to satisfy above 1 and 2

<script>
    function testingclick(){
        var $check_values = $("input[type=checkbox][name='myCheckbox[]']:checked");
        var $check_len = $check_values.length;
        var $total_len = $("input[type=checkbox][name='myCheckbox[]']").length;

        window.var_multiple_checked = $check_values.map(function(){  return "'" + this.value + "'";   }).get(); 
        temp_checked= window.var_multiple_checked;
    }
</script>

Yes, exactly, spent quite a good time for it. Thank you @billyonecan . — venkatesh52
– venkatesh52, Commented Nov 11, 2014 at 11:59

Alvin Magalona · Accepted Answer · 2014-11-11 11:37:08Z

0

For this code.

$('input:checkbox').not(this).prop('checked', this.checked);

Try to use removeProp instead

$('input:checkbox').not(this).removeProp('checked');

And for the events of your checkbox. Hook all with event.

$(document).ready(function() {
    $('input:checkbox').click(function () {
        if ($(this).attr('id') === 'checkAll' && $(this).is(':checked')) {
            $('input:checkbox').not($(this)).removeProp('checked');
        } else {
            $('#checkAll').removeProp('checked');
        }
    });
});

edited Nov 11, 2014 at 11:37

answered Nov 11, 2014 at 11:19

Alvin Magalona

7713 silver badges13 bronze badges

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

1 Comment

venkatesh52 Over a year ago

Edited it. Any suggestion to fulfill the funciton?

Collectives™ on Stack Overflow

How to uncheck a checkbox when checked option is other than 'All'

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related