Question

jquery:

(...)
$('#button_submit').click(function() 
{                           
func(check_box_values) 
});

html:

<form id="myForm">
<label class="checkbox">
<input type="checkbox" name="my_opt[]" value="1">opt1</label>
<label class="checkbox">
<input type="checkbox" name="my_opt[]" value="2">opt2</label>
<label class="checkbox">
<input type="checkbox" name="my_opt[]" value="3">opt3</label>
<input id='my_opt' type='hidden' name='my_opt[]' />
<input type="button" id="button_submit" value="go">
</form>

How could I pass this checked checkboxes values up there to use in func(check_box_values) ?

Answer 1

You can use the .map() method for that:

var check_box_values = $('#myForm [type="checkbox"]:checked').map(function () {
    return this.value;
}).get();

jsFiddle Demo

Explanation

• $('#myForm [type="checkbox"]:checked') selects the elements that are descendants of #myForm, have a type attribute with the value checkbox, and are checked.

• The .map() method iterates on the result elements, and the value that is returned in the function (which will be the value of the element, because here `this refers to the actual DOM element) is added to a collection.

• In the end, .get() is used to convert the collection into a simple Javascript array.