Disable sorting for first row of columns in thead.

NRS84

Hello!

I have a table that has multiple rows in the thead, like this:

<table>
    <thead>
        <tr class="areas">
            <th colspan="1">Remove</th>
            <th colspan="6">Student Info</th>
            <th colspan="4">Theory</th>
            <th colspan="2">Behind The Wheel</th>
            <th colspan="1">Send</th>
        </tr>
        <tr class="items">
            <th></th>
            (13 more th cells)
        </tr>
    </thead>
    <tbody>
        <tr>
            <td></td>
            (13 more td cells)
        </tr>
    </tbody>
</table>

Here is a screenshot to give you a better idea (and don't worry, it's all fake data):

Is there a way to disabled sorting on that first "areas" row? When I click one of them it sorts, but by the index of the column clicked. Clicking "student info" sorts "remove from list", "theory" sorts "student name", "behind the wheel" sorts "date of birth", etc...

I'd create an example, but this table is incredibly complex in multiple ways, so was hoping I could get by without having a working example.

I know I can go in and remove those ordering classes/attributes manually with my own jquery after the table has initialized, but was just wondering if there was a setting I could turn off without having to go in and manually remove those classes/attributes from each tr.areas > th tag.

Thanks for any help you can offer!

kthorngren

You can use columns.orderable to disable the user's ability to sort specific columns. Is this what you are looking for?

Kevin

NRS84

Hey Kevin!

Is there a way to target only the first row in the thead with columns.orderable?

I have tried messing around with columnDefs and turning orderable on and off for specific targets, but I couldn't target only the first row, unless I am missing something.

kthorngren

Try the orderCellsTop option. It should still work for now in DT 2.0 although there is this note:

Deprecated
As of v2.0.0 this feature has been deprecated. This feature has not yet been scheduled for removal, but its use is discouraged and the alternatives discussed below should be used.

Kevin

allan

See this example for discussion on the attributes that can be used to control the click behaviour of the table header cells.

Allan

kthorngren

@allan can the orderCellsTop docs have a link to this example in the Deprecated text?

Kevin

NRS84

Thank you @kthorngren and @allan!

Adding data-dt-order="disable" to my first thead row cells worked perfectly and is exactly what I needed, and was super simple and easy. Didn't have to do anything extra, and that is totally awesome!

Thank you both so much for your help!

Nic

allan

Good plan Kevin. I've committed that change and it will be on the site soon.

Allan