using jquery how do i get textbox value in table cell on button click in repeater control

Question

I have a repeater control and in each cell there is some text, bid button, and a textbox for bid amount. Im trying to get the textbox value (Bid amount) when the user clicks the button in the same cell so I can validate the bid amount. Any help would be greatly appreciated.

Here is my html table code:

<table id="values" class="values" border="3">
<tr>
<td  align="center"  style="white-space:nowrap">
<span class="MainBgContent_UpperRight_Title" style="height:25px;max-height:25px">Your Bid: $
<asp:TextBox ID="tbBid" CssClass="bids" Style="width: 30px" runat="server" Text=''></asp:TextBox>

</span>                                                
<div style="height:10px;clear:both;"></div>

<div class="offer" style="width:100px;height:30px;line-height:20px;">                                                    
<asp:Button style="width:100px;height:30px;line-height:20px;"  Visible="true"  CssClass="btnSubmitBid"  ID="lbBid" Text="BID" runat="Server" CommandName="makeBid"    ></asp:Button>                                                    
</div>
<div style="height:20px;clear:both;"></div>
</td>
</tr>
</table>

I can get the id of the button via class name btnSubmitBid, but need to get the textbox value for that specific cell only.

thank you

Answer 1

In the javascript function for the click of the button, you can traverse the DOM tree to find the input. Since the button is in a div, which is in the cell, you need to get the button's parent (div)'s parent (cell). Then find the first child (the span), and that span's child:

var bid = $(this).parent().parent().children()[0].children()[0];

Or you can use the find function on the cell to look for the input:

var bid = $(this).parent().parent().find("input");

Or, use the closest function, although I'm not sure if there is a big performance difference, and you already know the structure to know how far up you need to look to find the cell:

var bid = $(this).closest('td').find("input");

This answer assumes there is only on input in the table. If there is more than one, you should look for the class of .bids instead of the element type of input .