Get table cell values ​​row by row using jquery

Question

I have a table like this

<table class="wp-list-table widefat fixed posts"> <tbody id="c_b"> <tr> <td><b>Title</b></td> <td><b>Upcharge</b></td> <td><b>Profit Percentage</b></td> <td><b>Short Description</b></td> </tr> <tr> <td colspan="4"><input type="checkbox" id="selectall"> Bulk <u>Check/Uncheck</u></td> </tr> <tr> <td id="title_1"><input type="checkbox" id="product_1" value="123123_1" class="case"> 123123<br></td> <td id="upcharge_1">24</td> <td id="percentage_1">15</td> <td id="sdescription_1">This is a short</td> </tr> <tr> <td id="title_2"><input type="checkbox" id="product_2" value="A33232_2" class="case"> A33232<br></td> <td id="upcharge_2">24</td> <td id="percentage_2">15</td> <td id="sdescription_2">This is a short</td> </tr> <tr> <td id="title_22"><input type="checkbox" id="product_3" value="BEY-049_22" class="case"> Plane Shirt<br></td> <td id="upcharge_22">24</td> <td id="percentage_22">15</td> <td id="sdescription_22">SD for Plane shirt</td> </tr> <tr> <td id="title_23"><input type="checkbox" id="product_4" value="IRCTC_23" class="case"> Rail Neer<br></td> <td id="upcharge_23">24</td> <td id="percentage_23">15</td> <td id="sdescription_23">Rail neer short description</td> </tr> <input type="hidden" value="47474" id="licence_no" name="licence_no"><input type="hidden" value="47474" id="licence_no" name="licence_no"> <input type="hidden" value="47474" id="licence_no" name="licence_no"><input type="hidden" value="47474" id="licence_no" name="licence_no"> </tbody> </table> 

I want the cells to change line by line as an array, for this I write code, as shown below

 $("tbody>tr").each(function(){ var rowvalue = []; $("tbody>tr>td").each(function(){ //alert($(this).text()); rowvalue.push($(this).text()); }); alert(rowvalue); }); 

Here, I get all the values ​​at a time, and it warns n times (n = number of rows), but I want n the number of arrays with this row value. How can I get these values.

Answer 1

You can use this,

 var rowvalues = []; $("tbody > tr").each(function () { var rowvalue = []; $(this).children().each(function () { //alert($(this).text()); rowvalue.push($(this).text()); }); rowvalues.push(rowvalue); }); 

here the rowvalues ​​array will contain the row values ​​by size

Answer 2

Demo: http://jsfiddle.net/iambriansreed/2Pgey/

 var table_data = []; $('tr').each(function(){ var row_data = []; $('td', this).each(function(){ row_data.push($(this).text()); }); table_data.push(row_data); }); console.log(table_data); 

Answer 3

You must initialize the array outside the scope of each function. At each iteration, you clear the data from previous iterations. You can use the map method.

 var rowvalue = []; $("tbody > tr").each(function(i, v) { rowvalue[i] = $('td', this).map(function() { return $(this).text() }).get() }); console.log(rowvalue); 

http://jsfiddle.net/ydZBN/