Question

I am developing an invoice program and I am trying to select a single row using jquery but I Couldn’t exactly figure out how to select a row and extract its contents below is my code ! please advice

NOTE : I just added two rows but there will be more than 100 rows so i think its impossible to assign id’s for each td and call it using that id

 <table class="ProductSearch">
      <tr>
        <td>ID</td>
        <td>DESCRIPTION</td>
        <td>Qty</td>
        <td>PRICE</td>
        <td></td>
      </tr>
        <tr>
        <td>P1</td>
        <td>P1 Desc</td>
        <td>P1 Qty</td>
        <td>P1 Price</td>
        <td><img src="select.jpg" alt="select" class="select" /></td>
      </tr>
        <tr>
        <td>P2</td>
        <td>P2 Desc</td>
        <td>P2 Qty</td>
        <td>P2 Price</td>
        <td><img src="select.jpg" alt="select" class="select" /></td>
      </tr>
    </table>


$(".select").live('click', function(event) {
    var rselect;
    rselect = $(this).parent().parent().index();
$('.ProductSearch tr').each(function()
    {
      console.log($(this).html());
    });   
});

Answer 1

you can try closest() method:

$(".select").on('click', function(event) { // use `on()` as `live()` is deprecated
    var rselect;
    rselect = $(this).closest('td');
    console.log(rselect.html());
});

http://jsfiddle.net/NftQj/

---

Update:

if you want to iterate over the td elements of the tr you can try like below:

$(".select").on('click', function(event) { // use `on()` as `live()` is deprecated
    var rselect;
    rselect = $(this).closest('tr');
    rselect.find('td').each(function(){
       console.log($(this).html());
    })
});

http://jsfiddle.net/NftQj/2/