DataTables plugin: if not sortable remove text-decoration from column header
-
20-12-2019 - |
Question
I'm using the DataTables plugin, and on certain columns I have set "bSortable": false
. On those same columns I would like to remove the text underline and cursor pointer from the column header as well.
I created a class called removeFormat
which I would like to apply to JUST the column headers.
.removeFormat {
text-decoration: none;
cursor: auto;
}
How can I do so??
I was hoping I could use something like sClass
. Unfortunately, that only adds the classes to the table cells.
If creating a CSS class and adding it to the column header is not the right direction I should go in, is there a standard method which DataTables has which I can use for this specific purpose?
UPDATE:
I'd like to add a function directly to the column I am interested in changing. For instance:
{
"mData": null,
"sWidth": "5%",
"bSortable": false,
"sClass": "alignCenter"
}
Solution
I found the answer after playing around with it a bit.
In my case the sClass applied the class to both the table cells and the table header. So I just needed to add the class to the list:
"sClass": "alignCenter removeFormat"
I also just made sure that my class was specific enough that it applied to only the table headers and it applied to the element on hover:
th.removeFormat div:hover {}
That fixed it!