使用onClick事件处理程序使用jQuery访问html表中的数据

Question

I have a table that is being populated by a foreach loop to get data from a database:

foreach ($retrieve_data as $retrieved_data) {
    $content .= "
    <tr id=\"id_$retrieved_data->id\">
        <td> $retrieved_data->id </td>
        <td> $retrieved_data->posname </td>
        <td> $retrieved_data->month </td>
        <td> $retrieved_data->year </td>
        <td> $retrieved_data->availableinv </td>
        <td> $retrieved_data->maxinv </td>
        <td> <button type=\"button\" id=\"editImpressionsBtn\" value=\"Edit\">Edit </button>
    </tr>";
}

I want to write a jQuery function that gets data from the table like the id, availableinv, and maxinv when the edit button is clicked.

jQuery(document).on('click', 'editImpressionsBtn', function() {}

How can I assign a variable in this function to the data in each of these columns for only the row that the edit button was clicked?

Answer 1

Something like this? One thing I noticed, you need to make sure to add the selector (. or # for class or ID) to the handler.

$('.table_selector tbody').on('click', '.editImpressionsBtn', function(){ 
    row = $(this).closest('tr');

})

Then you can add values or ids and get them like this

var my_id_value = row.attr('id')