Find all unchecked checkboxes in jQuery

Question

I have a list of checkboxes:

<input type="checkbox" name="answer" id="id_1' value="1" />
<input type="checkbox" name="answer" id="id_2' value="2" />
...
<input type="checkbox" name="answer" id="id_n' value="n" />

I can collect all the values of checked checkboxes; my question is how can get all the values of unchecked checkboxes? I tried:

$("input:unchecked").val();

to get an unchecked checkbox's value, but I got:

Syntax error, unrecognized expression: unchecked.

Can anybody shed a light on this issue? Thank you!

possible duplicate of [jQuery: Find All Unselected Checkboxes, How To](http://stackoverflow.com/questions/1093350/jquery-find-all-unselected-checkboxes-how-to) — Felix Kling, Dec 11 '11 at 17:10
Possible duplicate of [How to find all unselected checkboxes?](https://stackoverflow.com/questions/1093350/how-to-find-all-unselected-checkboxes) — jacefarm, Oct 14 '17 at 20:02
@FelixKling This is clearly an exact duplicate. Please swing your jquery hammer. — mickmackusa, Jul 17 '20 at 05:58

score 500 · Accepted Answer · answered Dec 11 '11 at 17:09

500

As the error message states, jQuery does not include a :unchecked selector.
Instead, you need to invert the :checked selector:

$("input:checkbox:not(:checked)")

answered Dec 11 '11 at 17:09

SLaks

868,454
176
1,908
1,964

9

And using input[type=checkbox] is fastest. – jClark Jul 24 '15 at 16:36

score 36 · Answer 2 · answered Dec 11 '11 at 17:09

36

$("input:checkbox:not(:checked)") Will get you the unchecked boxes.

answered Dec 11 '11 at 17:09

dave

12,406
10
42
59

score 16 · Answer 3 · answered Aug 14 '18 at 14:38

16

Also it can be achieved with pure js in such a way:

var matches = document.querySelectorAll('input[type="checkbox"]:not(:checked)');

answered Aug 14 '18 at 14:38

Pavlo Hryza

627
1
11
18

score 10 · Answer 4 · edited Jan 17 '20 at 15:56

10

You can do so by extending jQuerys functionality. This will shorten the amount of text you have to write for the selector.

$.extend($.expr[':'], {
        unchecked: function (obj) {
            return ((obj.type == 'checkbox' || obj.type == 'radio') && !$(obj).is(':checked'));
        }
    }
);

You can then use $("input:unchecked") to get all checkboxes and radio buttons that are checked.

edited Jan 17 '20 at 15:56

Tobias Wicker

617
8
12

answered May 19 '12 at 09:23

Thulasiram

8,432
8
46
54

score 3 · Answer 5 · edited May 24 '13 at 16:34

$("input[type='checkbox']:not(:checked):not('\#chkAll\')").map(function () { 
   var a = ""; 
   if (this.name != "chkAll") { 
      a = this.name + "|off"; 
   } 
   return a; 
}).get().join();

This will retrieve all unchecked checkboxes and exclude the "chkAll" checkbox that I use to check|uncheck all checkboxes. Since I want to know what value I'm passing to the database I set these to off, since the checkboxes give me a value of on.

//looking for unchecked checkboxes, but don’t include the checkbox all that checks or unchecks all checkboxes
//.map - Pass each element in the current matched set through a function, producing a new jQuery object containing the return values.

//.get - Retrieve the DOM elements matched by the jQuery object.
//.join - (javascript) joins the elements of an array into a string, and returns the string.The elements will be separated by a specified separator. The default separator is comma (,).

You shouldn't be including something in your answer that is completely irrelevant for the OP. He doesn't use a `chkAll` box so what's the point of mentioning it. — MMM, May 24 '13 at 16:36

score 3 · Answer 6 · answered Jul 31 '16 at 07:28

3

You can use like this :

$(":checkbox:not(:checked)")

answered Jul 31 '16 at 07:28

Ehsan

12,655
3
25
44

1

Why repeat the guidance already provided years earlier? Furthermore, please never post code-only snippets on SO. All answers should be explained. – mickmackusa Jul 17 '20 at 05:19

score 3 · Answer 7 · answered Feb 23 '19 at 06:22

3

To select by class, you can do this:

$("input.className:checkbox:not(:checked)")

answered Feb 23 '19 at 06:22

Chukwuemeka Inya

2,575
1
17
23

1

The question asked does not have a `class` attribute. This is an unnecessary answer since the suggestion of `:checkbox:not(:checked)` was given **YEARS** earlier. – mickmackusa Jul 17 '20 at 05:18

score -1 · Answer 8 · answered Dec 20 '17 at 07:17

-1

$(".clscss-row").each(function () {
if ($(this).find(".po-checkbox").not(":checked")) {
               // enter your code here
            } });

answered Dec 20 '17 at 07:17

UTHIRASAMY

1
2

2

Welcome to StackOverflow! Please add an explanation to your code, so other users (for whom this might be what they're looking for) know what your code does. – Nander Speerstra Dec 20 '17 at 07:40

Find all unchecked checkboxes in jQuery

8 Answers8

Linked

Related