jQuery Array of all selected checkboxes (by class) [duplicate]

Possible Duplicate:
Select values of checkbox group with jQuery

In HTML I have a set of checkboxes grouped together by a class. I want to get an array in jQuery containing all the checkboxes that are selected/checked for that class (so other checkboxes on the page are ignored).

So HTML code like this:

<input type="checkbox" class="group1" value="18" checked="checked" />
<input type="checkbox" class="group1" value="20" />
<input type="checkbox" class="group1" value="15" />
<input type="checkbox" class="group2" value="14" />
<input type="checkbox" class="group1" value="55" checked="checked" />
<input type="checkbox" class="group1" value="10" checked="checked" />
<input type="checkbox" class="group2" value="77" checked="checked" />
<input type="checkbox" class="group1" value="11" />

Would return the values of the checked/selected group1 checkboxes into an array like this:

var values = [ 18, 55, 10 ];

Solution 1:

You can use the :checkbox and :checked pseudo-selectors and the .class selector, with that you will make sure that you are getting the right elements, only checked checkboxes with the class you specify.

Then you can easily use the Traversing/map method to get an array of values:

var values = $('input:checkbox:checked.group1').map(function () {
  return this.value;
}).get(); // ["18", "55", "10"]

Solution 2:

var matches = [];
$(".className:checked").each(function() {
    matches.push(this.value);
});

Solution 3:

You can also add underscore.js to your project and will be able to do it in one line:

_.map($("input[name='category_ids[]']:checked"), function(el){return $(el).val()})