Select all checkbox values by selecting the first checkbox in an array with JQuery

Question

I am trying to check all checkboxes if a user clicks the first checkbox.

HTML

 <input class="checkall" type="checkbox" id="edit-field-industry-und-45" name="field_industry[und][45]" value="45"> 
 <input class="checkall" type="checkbox" id="edit-field-industry-und-24" name="field_industry[und][24]" value="24"> 
 <input class="checkall" type="checkbox" id="edit-field-industry-und-25" name="field_industry[und][25]" value="25">
 <input class="checkall" type="checkbox" id="edit-field-industry-und-26" name="field_industry[und][26]" value="26">
 <input class="checkall" type="checkbox" id="edit-field-industry-und-27" name="field_industry[und][27]" value="27">

Here is what I tried

$('#edit-field-industry-und-45').click(function(event) {  //on click 
        if(this.checked) { // check select status
            $('.checkall').each(function() { //loop through each checkbox
                this.checked = true;  //select all checkboxes with class "checkbox1"               
            });
        }else{
            $('.checkall').each(function() { //loop through each checkbox
                this.checked = false; //deselect all checkboxes with class "checkbox1"                       
            });         
        }
    });

Any errors in the console? Did you include jquery properly? It works: jsfiddle.net/4ydn8cuj — Andrew Brooke
– Andrew Brooke, Commented Jan 12, 2016 at 4:16
This could be as simple as $('#edit-field-industry-und-45').click(function() { //on click $('.checkall').prop('checked', this.checked); }); — Arun P Johny
– Arun P Johny, Commented Jan 12, 2016 at 4:20

Jobelle · Accepted Answer · 2016-01-12 04:20:30Z

2

$('#edit-field-industry-und-45').change(function () {
        $('input[type="checkbox"]').each(function () {
            $(this).prop("checked", true);
        });
    })

answered Jan 12, 2016 at 4:20

Jobelle

2,8441 gold badge17 silver badges27 bronze badges

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

Comments

Amar Singh · Accepted Answer · 2016-01-12 05:07:42Z

Check out my DEMO . I am sure you will like it

<input type="checkbox" id="anchor-from"/>main

<input type="checkbox" class="checkall" id="period-daily" disabled />CheckBox2
<input type="checkbox" class="checkall" id="period-weekly"disabled />CheckBox3
<input type="checkbox" class="checkall" id="period-weekly2"disabled />CheckBox3
<input type="checkbox" class="checkall" id="period-weekly3"disabled />CheckBox3
<input type="checkbox" class="checkall" id="period-weekly4"disabled />CheckBox3




$("#anchor-from").change(function(){
                if($('#anchor-from').is(':checked'))
                {
                  $(".checkall").attr("disabled", false); 
                  $(".checkall").prop("checked", true); 

                }
                else
                {
                $(".checkall").attr("disabled", true);
                 $(".checkall").prop("checked", false); 
                }



            });

Collectives™ on Stack Overflow

Select all checkbox values by selecting the first checkbox in an array with JQuery

HTML

Here is what I tried

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

HTML

Here is what I tried

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related