Custom HTML based table header without breaking sorting

Pete44

Is there an elegant possibility to add custom HTML to a specific table column header without breaking the default sorting functionality?

I can change the column header with setting a custom title like

title: "<span>Triggers column sort</span><span>Don't trigger column sort</span>",

But both texts are triggering the sorting behaviour. I'm interested to add a custom button next to the default text with my own stuff in the table header.

kthorngren

The easiest option is to use two header rows and use orderCellsTop to define the header to use for sorting.

Alternatively you can turn off the Datatables created event listeners and create your own elements to add the listeners using order.listener(). I think these three threads will have all the info needed to do this:
https://datatables.net/forums/discussion/24266/problem-with-the-jquery-datatables-order-listener
https://datatables.net/forums/discussion/40750/ordering-only-when-click-on-icon
https://datatables.net/forums/discussion/74650/modify-sort-behavior-column-header-to-only-trigger-sorting-when-i-click-on-the-header-name

Kevin

Pete44

Thanks a lot for your fast reply @kthorngren.
I will check your suggestions and take the one which fits best for my use case.