Question

I’m trying to write an array to a variable so that I can print it in a div, however I can’t seem to get it right no matter what I do.

<input type="checkbox" class="checkboxes" value="1" checked="checked" />
<input type="checkbox" class="checkboxes" value="2" />
<input type="checkbox" class="checkboxes" value="3" checked="checked" />
<input type="checkbox" class="checkboxes" value="4" checked="checked" />

Should return 1,3,4

So I have:

var variable1 = $('input:checkbox:checked.checkboxes').map(function () {
  return this.value;
  }).get();
  $("#somediv").html(variable1);

However the div is empty, does anyone know where I went wrong?

Answer 1

You need to convert the array to a string. Use toString(), if a comma separated list is good enough for your needs:

var variable1 = $('input:checkbox:checked.checkboxes').map(function(){
    return this.value;
}).get().toString();
$("#somediv").html(variable1);

Edit

You can also speed up your selector if you want.

$('input:checkbox:checked.checkboxes')

Is equivalent to the slightly faster:

$('input.checkboxes').filter(':checkbox:checked')

And if you don’t assign the class checkboxes to anything other than a checkbox, the even faster:

$('input.checkboxes').filter(':checked')