how to get checked and unchecked check box values in an array using javascript/jquery

Question

how to get checked and unchecked check box values in an array using javascript/jquery.

I have a list of check boxes.
Below is the sample code.

<input type="checkbox" class="chkCountry" value="1" checked="checked" />India    
<input type="checkbox" class="chkCountry" value="4" checked="checked" />China     
<input type="checkbox" class="chkCountry" value="2"/>Pakistan    
<input type="checkbox" class="chkCountry" value="3"/>Japan

Here i want to get the checked values in a array unchecked values in another array.

And if again i want to unchecked the checked values(here India and China), i want to get the values(1,4) in another array.

Arun P Johny · Accepted Answer · 2014-12-03 06:53:45Z

2

You can use .map() to convert a jQuery object set to an array like

var $checks = $('.chkCountry');

var checked = $checks.filter(':checked').map(function () {
    return this.value;
}).get();
var unchecked = $checks.not(':checked').map(function () {
    return this.value;
}).get();

answered Dec 3, 2014 at 6:53

Arun P Johny

389k68 gold badges532 silver badges532 bronze badges

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

3 Comments

kiranstack Over a year ago

if there are already some unchecked check boxes are available, So its getting all the unchecked checkboxes value with current unchecked checkbox value, But Here I want only one unchecked checkbox value which is currently unchecked.

Arun P Johny Over a year ago

@kiranstack so your script is in a change event handler

kiranstack Over a year ago

Yes, its in onclick event.

Milind Anantwar · Accepted Answer · 2014-12-03 06:58:40Z

0

To get checked :

arrchecked = $('.chkCountry').map(function() {
    if(this.checked)
     return this.value;
}).get();
arrunchecked = $('.chkCountry').map(function() {
    if(!this.checked)
     return this.value;
}).get();

Working Demo

edited Dec 3, 2014 at 6:58

answered Dec 3, 2014 at 6:53

Milind Anantwar

82.3k26 gold badges97 silver badges128 bronze badges

3 Comments

Kartikeya Khosla Over a year ago

use var with arrchecked and arrunchecked

Arun P Johny Over a year ago

this will return arrays with true and false values... I don't think that is what OP is after

Milind Anantwar Over a year ago

Updated the answer with fiddle.

Jai · Accepted Answer · 2014-12-03 08:15:18Z

0

You can use this:

var checked=[], unchecked=[];

$('.chkCountry').change(function() {
     if(this.checked){
          checked.push(this.value);
          unchecked.splice(this.value, 1);
     }else{
          unchecked.push(this.value);
          checked.splice(this.value, 1);
     }
}).change();

I stated a .splice() method to remove element if you need to update the array with uncheck.

edited Dec 3, 2014 at 8:15

answered Dec 3, 2014 at 7:01

Jai

74.8k12 gold badges77 silver badges104 bronze badges

3 Comments

kiranstack Over a year ago

if there are already some unchecked check boxes are available, So its getting all the unchecked checkboxes value with current unchecked checkbox value, But Here I want only one unchecked checkbox value which is currently unchecked.

Jai Over a year ago

@kiranstack you can place a trigger at the closing like in the code:}).change();.

kiranstack Over a year ago

still its not able to get the current uncheched checkbox value..instead its getting all the unchecked checkbox values

Collectives™ on Stack Overflow

how to get checked and unchecked check box values in an array using javascript/jquery

3 Answers 3

3 Comments

3 Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

3 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related