Sora
Sora

Reputation: 2551

accessing a siblings in jquery

here is my code :

<table><tr><td>hello</td>
       <td><input type="text" value="0" onkeypress="GetValue();" /></td>
       <td><input type="text" value="15"  /></td>
       </tr>
 </table>
   <script type="text/javascript">
   function GetValue(){
      //  ???

       }
   </script>

how can i access the value of the third td ( the td with the value 15 ) without using the the easy way and give the td an id and call it i want by using .parent() or .siblings() this is a simple example to simplify my work but in my actual project the input have their value binded from DB and it's much more complicated any help apreciated

Upvotes: 0

Views: 95

Answers (5)

Doink
Doink

Reputation: 1162

HTML

<table id='theTable'><tr><td>hello</td>
       <td><input type="text" value="0" onkeypress="GetValue();" /></td>
       <td><input type="text" value="15"  /></td>
       </tr>
 </table>​​​

Use the nth-child() jQuery function

console.log($('#theTable td:nth-child(3)').children().val());​​​​​

Upvotes: -1

VisioN
VisioN

Reputation: 145398

You should pass the DOM element to GetValue function:

<input type="text" value="0" onkeypress="GetValue(this);" />

And use jQuery methods to get the value from the next text field:

function GetValue(that) {
    var val = $(that).parent().next().find("input").val();
}

DEMO: http://jsfiddle.net/xzzUB/1/

Upvotes: 2

Change input like this:

<input type="text" value="0" onkeypress="GetValue(this);" />

and function to:

function GetValue(el){
  var sib = $(el).parent().siblings('td').last();
}

Upvotes: 0

Matt.C
Matt.C

Reputation: 1322

$("td:eq(2) input").val() will return 15

See: http://docs.jquery.com/Selectors/eq

Upvotes: 0

mas-designs
mas-designs

Reputation: 7536

You can do it via the :nth-child() selector.

JS code:

$('table td:nth-child(3) input').val();

DEMO

Upvotes: 3

Related Questions