In regards to sliding child rows

DingusAmongus

Accidentally posted this question on http://datatables.net/blog/2014-10-02, so here it is in the proper place:

I'm new to DataTables, and this is probably a silly question, but how would I go about making each row expandable on clicking it anywhere in the row, instead of having a button expand it? Thanks in advance for taking the time to read and/or answer! :)

ThomD

Are you asking how to have the child containers show all the time?

DingusAmongus

No, I'm sorry, I'm asking how to make it so that upon clicking any part of any row, the row expands to show more detail, similar to the way that the rows expand by clicking the (+) button on that blog post.

ThomD

In the example

http://datatables.net/examples/api/row_details.html

Line 39 ties the open/close action to the Click event of a td with the style of .details-control. To apply this action to the click on the row instead, you could change line 39 of the example from

    $('#example tbody').on('click', 'td.details-control', function () {

to

    $('#example tbody').on('click', 'tr', function () {

Line 40 might need to be changed from

       var tr = $(this).closest('tr');

to

       var tr = $(this);

The key is the jquery selector, which changes the context for "this".

I haven't tested it, but it should work.

DingusAmongus

That would mean I don't need
"class": 'details-control',

right?

ThomD

true

DingusAmongus

I actually already had some of that code there and didn't realize it, so just changing the similar lines in my code that you said to change in the example code worked! Thank you ThomD!