title: Get checked checkbox values in an array on form submit
body: <p>I want to get all the values of checkboxes and alert them that are checked on form submit,</p>
  
  <p>Here is what I have tried so far:</p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;form id="calform"&gt;
  &lt;input type="checkbox" value="one_name" /&gt;
  &lt;input type="checkbox" value="one_name1"/&gt;
  &lt;input type="checkbox" value="one_name2"/&gt;
  &lt;input type="submit" value="Submit" /&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p><strong>jQuery Script</strong></p>
  
  <pre><code>      $("#calform").submit(function(e){
  
      // array that will store all the values for checked ones
      var allVals = [];
  
      $('input[type="checkbox"] :checked').each(function() {
  
      // looping through each checkbox and storing values in array for checked ones.
      allVals.push($(this).val());
  
      });
  
      alert(allVals);
  
      e.preventDefault();
      });
  </code></pre>
  
  <p>Here it is on <a href="http://jsfiddle.net/d893C/" rel="noreferrer">JSFIDDLE</a></p>
  
  <p>Alert box shows up empty on form submit.</p>