简体   繁体   中英

JQuery: Iterating through table rows for 2 specific cells

I am a total JQuery newbie and I have been researching this for the past 2 days but my brain is now fried.

Here is what I have:

A table that has a certain amount of rows (like an online store's cart)

I do not want the last row (since that contains cart total) and I do not want the first row (which are the column headers)

Here is what I want:

On document load, I want to go through each row of that table (except first and last) and grab (for example) the first column and last column, pass those values to a web service, and have the web service return a value to put in another column's text box of that row

the table structure is as follows:

<table id="blahzayblahgrdItems">
<tbody>
<tr>
<td>product</td>
<td>req.ship date</td>
<td>est.ship date(input textbox)</td>
<td>price</td>
<td>qty</td>
<td>subtotal</td>
</td>
</tbody>
</table>

I'm trying to grab the values from the Product column and the QTY column to pass to webservice and populate the EST. Ship Date column with whats returned from the web service

In code, I've tried something like

$(function()
{
var partID;
var qty;

$("table[id*=grdItems] tbody tr").each(function() {})
)

However, I'm drawing a blank on getting the actual quantity and product to pass to my webservice. I've tried different variations of code and throwing an alert box to see whats getting returned but I'm seeing headers, pieces of the table data, the full table data, etc. Any help would be GREATLY appreciated.

Set a class for each row you want to parse and do this:

var partID = $("tr.some_class td")[4].text();
var qty = $("tr.some_class td")[5].text();

I think it would be a little easier to put a class (like info ) on the first and last rows (especially for styling) and do the following.

Updated jsfiddle with working example using jsfiddle's json echo:

http://jsfiddle.net/lucuma/fNwvX/3/

// add a class to first and last tr to make formatting a little nicer as well
$('#blahzayblahgrdItems tr:first,#blahzayblahgrdItems tr:last').addClass('info');
// loop over each one except the ones with class
$('#blahzayblahgrdItems tr:not(.info)').each(function() {
    var $prod = $('td:eq(0)', this);
    var $sub = $('td:eq(5)', this);

    var result = $prod.text() + '-' + $sub.text();     // do your ajax with these values
    $.get('ajax/test.html', function(data) {
      $prod.text(data.val1);  // depends on your system
      $sub.text(data.val2);   // depends on your system
    });



});​

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM