CODEWITHSUNDEEP
jqueryjquery-selectors
Arooran
Arooran

Reputation: 637

Find the next input value from a table row

I have some table data with some codes: 

<tr>
  <td><input type='text' class='ACode' value='3400' /></td>
  <td><input type='text' class='DCode' value='100' /></td>
<tr>
<tr>
  <td><input type='text' class='ACode' value='3000' /></td>
  <td><input type='text' class='DCode' value='130' /></td>
<tr>
<tr>
  <td><input type='text' class='ACode' value='2500' /></td>
  <td><input type='text' class='DCode' value='110' /></td>
<tr>

When I want to access the ACode next input value using jQuery like this: 

$('.ACode').change(function(){
  var that = $(this);
  var DCode =  that.next('.DCode').val();
});

it doesn't show the value.

Upvotes: 0

Views: 5595

Answers (2)

Jo&#227;o Silva
Jo&#227;o Silva

Reputation: 91359

Try the following instead:

var DCode =  that.parent().next().find('.DCode').val();

.ACode does not have siblings, thus .next() does not get anything, since it only returns the immediately following siblings. Instead, you should go to the parent td, which indeed has one sibling, use .next() to get to the next td, and then find .DCode.

DEMO.

Upvotes: 2

David Thomas
David Thomas

Reputation: 253496

I'd suggest:

$('.ACode').change(function(){
    var that = $(this),
        DCode =  that.closest('tr').find('.DCode').val();
});

References:

Upvotes: 0

Related Questions