Getting row data from a row button
Getting row data from a row button
Hi guys,
In many of my tables I have to add buttons to the row. I just create a simple <button> in the column. To trap the click I use
$('#contacts-table tbody').on( 'click', 'button', function (e) {
} );
This works fine and does everything I need it to do. But the problem is I do not have access to the DT objects, like row and data so I can't use code like:
var rowData = contactsTable.row(this).data();
or
var rowData = contactsTable.rows({selected : true}).data();
The problem is that the button has to stop the propagation so the click doesn't select the row, so it appears the row is never selected and thus the row object is undefined when I click on the button. It always shows me the data from the first line in the table, no matter which row the button I'm clicking is in.
It works fine if I trap the click on the TR:
$('#contacts-table tbody').on( 'click', 'tr', function (e) {
but then I have no idea what button was clicked...
Sometimes it is very helpful to have direct access to the data. I have solved this in the past by adding data- tags to the button and then retrieve those when the user clicks on it, but I'm sure there is a way to get this from the DT object. Just can't find how! Or is there another way of handling the click event on the buttons so I can get both the row data and the click event on the button?
Many thanks in advance!
Best regards,
Arnor
This question has an accepted answers - jump to answer
Answers
Use
select.selector
to control this. You can remove the cell that has the buttons so clicking the button doesn't select the row.This example show how to get the row that contains the clicked button:
http://live.datatables.net/xijecupo/1/edit
Kevin
Hi Kevin,
Thank you very much for the reply! I will study this tomorrow and see what I come up with
Best regards,
Arnor
Hi Kevin,
Worked perfectly of course!!! Thank you so much for setting me straight on this Have a great weekend
Best regards,
Arnor