Reputation: 1322
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
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