HuorCulnamo HuorCulnamo - 16 days ago 4
HTML Question

How to Select Unchecked Checkboxes but Not Indeterminate State Ones

My list of checkboxes consists of checked, unchecked, and indeterminate (3rd) state. For those who are wondering, I'm using jQuery to set indeterminate state for some checkboxes. At the end, I would like to find and select all of checkboxes with the unchecked state but not the indeterminate state with the use of jQuery.

Here are my checkboxes

<div id="list">
<input id="item-1" type="checkbox">
<input id="item-2" type="checkbox">
<input id="item-3" type="checkbox">
<!-- and so on -->
</div>


I can get the checked ones with the following

var checkedItems = $("#list").find("input:checkbox:checked");


I can also get all the unchecked with the following

var uncheckedItems = $("#list").find("input:checkbox:not(:checked)");


However,
uncheckedItems
will return me items that have indetermine state as well.

I've tried the following as well but I got
unsupported pseudo: indeterminate(…)


var uncheckedItems = $("#list").find("input:checkbox:not(:checked):not(:indeterminate)");


So how do I only select unchecked items without selecting indeterminate ones?

Thank you in advance.

Answer

You can use filter on the indeterminate property

$("[type=checkbox]:not(:checked)")
  .filter(function () { return !this.indeterminate; });

See jsfiddle

Comments