Namit
Namit

Reputation: 1322

Detect the row and get the td value using javascript. (Dynamic table)

I totally want to avoid using inline javascript! But i have a table which is being dynamically generated from a mysql database using php. I want that if a user clicks on any of the rows it creates a modal with the information about the clicked row. Now i am able to initialise the modal, however the first column of the table holds an index value which can be used to retrieve the information about that row. My question is how can i retrieve that index value using javascript. To initiate the modal i am using the following code:

$('#production tr').click(function(){
     $('#review_order').modal('show');
}) ;    

Table markup:

<table id="order_basket" class="table table-bordered">
    <thead>
       <th>Voucher ID</th>
       <th>Title</th>
       <th>Created By</th>
    </thead>
    <tbody>
       <tr><td>1<td>
        <td>Something here</td>
        <td>Some Person</td></tr>
    </tbody>
<table>

Upvotes: 0

Views: 2175

Answers (1)

pimvdb
pimvdb

Reputation: 154838

Unless you've added rowspan/colspan attributes, the first column in a row is the tr's first td child:

$('#production tr').click(function() {
    var index = $(this).children("td").first().text();
    // `index` is the text in the first column in the clicked row

    $('#review_order').modal('show');
});

Upvotes: 1

Related Questions