How to sort the child rows hidden in responsive

kholosso

I need to sort the hidden elements in the child row whrn the datatable is responsive using dt-responsive

colin

Hi @kholosso ,

We're happy to take a look, but it would help, as per the forum rules, if you could link to a running test case showing the issue so we can offer some help. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

Cheers,

Colin

Tester2017

@kholosso

One question.

Why would you like to sort rows on a column that is not visible? Without knowing (seeing) the value of that column a sort will not be very informative for a user.

That being asked. You know that you can set priorities to columns regarding the visibility in a responsive layout. See here: https://datatables.net/extensions/responsive/priority

OK, but ff you really want to sort on columns in the child row, you can do a sort programmatically like this:

$('#table').DataTable().order([columnToSort, sortOrder]).draw();

Where:
#table -> your table selector
columnToSort -> the number of the column you would like to do the sort on
sortOrder -> sort ascending or descending

But then you have to offer some kind of button (or other UI element) to the user to trigger the sort.

allan

Responsive displays the data in column index order.

If you need to display it in some order other than the order your columns are in, you'd need to specify your own renderer - responsive.details.renderer.

Allan