CODEWITHSUNDEEP
javascriptjquerydatatables
Vivian River
Vivian River

Reputation: 32400

How to respond to the user selecting a row in jQuery.dataTables?

I'm writing a web application using jQuery.dataTables. I'm sure I did this some time before, but I'm having trouble figuring out the proper way to make my page respond to the user clicking on a row.

The basic idea is that I want to be able to respond to a click on a row by showing the user more information about that row. I would like to invoke some function when the row is clicked. I may also need to place one or more buttons in each row that can be clicked on to do row-specific functionality, such as navigate to a form to edit or delete a row.

$('#tblData').dataTable({
    data: data,
    columns: columns, // only column names specified
    bFilter: false,
    bPaginate: false,
    bInfo: false
});

I would have thought that the "Events" reference might answer this (http://www.datatables.net/reference/event/), but I haven't had any such luck.

Upvotes: 0

Views: 38

Answers (1)

Anthony Veach
Anthony Veach

Reputation: 320

To place an event on the table's row I would use the .on method:

$("#tblData").on('click','tbody > tr',function(e){ });

Then, if you place buttons inside the rows, you can do the same thing using the button selectors. Just make sure you use e.stopPropagation() in the button click to keep the row click from firing.

Upvotes: 1

Related Questions