I have several checkboxes with a name array and I want the output of the checked boxes to be a variable with a comma separated list.
<input type="checkbox" name="example[]" value="288" />
<input type="checkbox" name="example[]" value="289" />
<input type="checkbox" name="example[]" value="290" />
For example if the first and last box are selected the output will be:
var output = "288,290";
How can I do this with jQuery?
You can use :checkbox and name attribute selector (:checkbox[name=example\\[\\]]) to get the list of checkbox with name="example[]" and then you can use :checked filter to get only the selected checkbox.
Then you can use .map function to create an array out of the selected checkbox.
var output = $.map($(':checkbox[name=example\\[\\]]:checked'), function(n, i){
return n.value;
}).join(',');
[ and ] jsfiddle.net/6LCvN/22 or wrap in quotes jsfiddle.net/hmtdtwbrCurrently un-tested, but I believe the following should work:
var valuesArray = $('input:checkbox:checked').map( function () {
return $(this).val();
}).get().join();
Edited, after a small break, to use native DOM, rather than $(this).val() (which is needlessly expensive, in context):
var valuesArray = $('input:checkbox:checked').map( function() {
return this.value;
}).get().join(",");
var valuesArray = $('input[name="valuehere"]:checked').map(function () { return this.value; }).get().join(",");
works for me always
