0

How do I take only the selected checkboxes and store them into an array when the button is clicked?

This is the code I currently have. It is not finished because I'm not sure what to do as I am new to jQuery

$(document).ready(function() {
    // code
    var configs = [];
    var testPages = [];

    $("button").click(function(){
        $(".testpages")....
        $(".configs").....
    })
});

Html:

<form>
  <div class="test">
    <input id="1" type="checkbox" value="val1">a<br>
    <input id="2" type="checkbox" value="val2">b<br>
    <input id="3" type="checkbox" value="val3">c<br>
  </div>
  <div class="config">
    <input id="10" type="checkbox" value="val10">a1<br>
    <input id="11" type="checkbox" value="val11">a2<br>
    <input id="12" type="checkbox" value="val12">a3<br>
  </div>
</form>
<button type="button">submit</button>
Liondancer
  • 15,721
  • 51
  • 149
  • 255

1 Answers1

1

Try this:

$("button").click(function(){
        $('.test input:checked').each(function() {
           testPages.push($(this).attr('id'));
       });
       $('.config input:checked').each(function() {
           configs.push($(this).attr('id'));
       });
});
Kiran
  • 20,167
  • 11
  • 67
  • 99
  • This code does not display any error but when I add `console.log(configs)` in the click function. Nothing is displayed after the click. Typing in `configs` in the developer tools it get a message saying it is not defined. I am not sure how to test is my code is working as I am pretty new to JS/jQuery http://jsfiddle.net/liondancer/gwrermga/ – Liondancer Oct 21 '14 at 16:59
  • 1
    @Liondancer: Updated fiddle with code bro. http://jsfiddle.net/kunknown/gwrermga/1/ – Kiran Oct 21 '14 at 17:15