title: How can I select multiple checkboxes at once?
body: <p>I have a html table which is created dynamically. Im adding check box for each row.</p>
  
  <pre><code>$.each(data, function(id, value) {
    rows.push('&lt;tr&gt;&lt;td&gt;&lt;input type="checkbox"  autocomplete="off" class="chkbox" name="chkbox" value="'+value.site+':'+value.client+'"&gt;&lt;/td&gt;&lt;td&gt;' + id + '&lt;/td&gt;&lt;td&gt;' + value.machine + '&lt;/td&gt;&lt;td&gt;' + value.state + '&lt;/td&gt;&lt;td&gt;' + value.date_processed + '&lt;/td&gt;&lt;td&gt;&lt;button type="button" onclick="resetSite(\''+ value.site+'\',\''+value.client+'\')"&gt;Reset&lt;/td&gt;&lt;/tr&gt;');
  });
  </code></pre>
  
  <p>I want to select multiple rows at once and need to POST the values to my backend service.
  Currently my JavaScript function is like;</p>
  
  <pre><code>$(document).on('change','.chkbox',function () {
    var sites = [];
    var value = $(this).val();
    var res = value.split(":");
    $.each($("input[class='chkbox']:checked"), function(){            
      sites.push(res[0]);
    });
    alert("sites are: " + sites.join(", "));
    $.ajax({
      type: "POST",
      url: "http://localhost:8080/cache/setProcessing?site="+res[0]+"&amp;client="+res[1],
      /*data: {
        chkbox: value 
      },*/
      error : function(xhr, textStatus, errorThrown) {
        alert("Failed. Error : " + errorThrown);
      }
    });
  });
  </code></pre>
  
  <p>in the above function my alert box shows same site multiple times if I selecet more than one row.
  How can I overcome this?</p>