title: How to select value of all the tbody inputs values using jQuery
body: <p>so I have some checkboxes, when each one is checked I'm able to get the id number I need from the associated table row and place them into my <code>contacts</code> array.</p>
  
  <p>I also have a <strong>Select all checkbox</strong> which is meant to grab all the id numbers and stick them into the same array.</p>
  
  <p>Having a bit of trouble trying to figure out the correct syntax to target the tbody, select every table row's data-id, or every table row's input's value.</p>
  
  <p><a href="http://jsfiddle.net/leongaban/7LCjH/" rel="nofollow noreferrer">http://jsfiddle.net/leongaban/7LCjH/</a></p>
  
  <p>^ In my fiddle example you can see the numbers get added to my array (or the gray div for visualization). 
  <hr>
  How would you grab all the id numbers from the tbody rows from the Select all checkbox?</p>
  
  <p>jQuery</p>
  
  <pre><code>var contacts = [];
  
  // add multiple select / deselect functionality
  $("#selectall").click(function () {
      $('.case').attr('checked', this.checked);
      //contacts.push($('#tbody').children(tr &gt; td &gt; input).val();)
  });
  
  // if all checkbox are selected, check the selectall checkbox
  // and viceversa
  $(".case").click(function() {
  
      var $tr = $(this).closest("tr");
      var id = $tr.data('coworker-id');
  
      contacts.push(id);
  
      $('#arrayContent').empty();
      $('#arrayContent').append(contacts+',');
  
      if ($(".case").length == $(".case:checked").length) {
          $("#selectall").attr("checked", "checked");
      } else {
          $("#selectall").removeAttr("checked");
      }   
  
  });
  </code></pre>
  
  <p>HTML</p>
  
  <pre><code>&lt;table&gt;
  
  &lt;thead&gt;
      &lt;tr&gt;
          &lt;td&gt;&lt;input type="checkbox" id="selectall"/&gt;&lt;/td&gt;
          &lt;td&gt;Select All&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr&gt;
          &lt;td colspan="2"&gt;&lt;hr/&gt;&lt;/td&gt;
      &lt;/tr&gt;
  &lt;/thead&gt;
  
  &lt;tbody id="tbody"&gt;
      &lt;tr data-coworker-id="1"&gt;
          &lt;td&gt;&lt;input type="checkbox" class="case" name="case" value="1"/&gt;&lt;/td&gt;
          &lt;td&gt;1&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr data-coworker-id="2"&gt;
          &lt;td&gt;&lt;input type="checkbox" class="case" name="case" value="2"/&gt;&lt;/td&gt;
          &lt;td&gt;2&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr data-coworker-id="3"&gt;
          &lt;td&gt;&lt;input type="checkbox" class="case" name="case" value="3"/&gt;&lt;/td&gt;
          &lt;td&gt;3&lt;/td&gt;
      &lt;/tr&gt;
  &lt;/tbody&gt;
  </code></pre>
  
  <p></p>
  
  
  
  <p><img src="https://i.stack.imgur.com/FQeQr.png" alt="enter image description here"></p>