Jsel Jsel -4 years ago 86
HTML Question

get the values of all cells in table row using jquery

i would like to get the values in each cell in table row which is selected using checkbox.
Scenario: Whenever user clicks show table button, my page dynamically loaded with some data from tables, which has columns like checkbox, Item name, Item code, Quantity, Rejected, accepted. Now i want to get the values of selected rows when user click button called "save".

<script type="text/javascript">
$(document).ready(function() {
$.post('PopulateTable',{grn : $('#grn').val()},function(responseJson) {
var table1 = $("#itemtable");
$.each(responseJson, function(key,value) {
var rowNew = $("<tr><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>");
rowNew.children().eq(0).html('<input type="checkbox" />');
rowNew.children().eq(5).html('<input type="text" class="tb2"/>');
rowNew.children().eq(6).html('<input type="text" class="tb2"/>');
rowNew.children().eq(7).html('<input type="text" class="tb2"/>');


<div id="tablediv">
<table cellspacing="0" id="itemtable" align="center">
<td><input type="checkbox" /></td>
<th scope="col">Item name</th>
<th scope="col">Item code</th>
<th scope="col">Supplier</th>
<th scope="col">Received qty</th>
<th scope="col">Accepted qty</th>
<th scope="col">Rejected qty</th>
<th scope="col">Remarks</th>

Answer Source

First give "name" to your checkbox, such as :

<input type="checkbox" name="case[]" />

JS code:

 var values = new Array();

       $.each($("input[name='case[]']:checked"), function() {
           var data = $(this).parents('tr:eq(0)');
           values.push({ 'Item name':$(data).find('td:eq(1)').text(), 'Item code':$(data).find('td:eq(2)').text() , 'Supplier':$(data).find('td:eq(3)').text()});             


Please check out the EXAMPLE

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download