styling column().header()

Khalid Teli

Link to test case:
Debugger code (debug.datatables.net):
Error messages shown:
Description of problem:

How can I use the same styling which i use for original "thead th" after I dynimcally change the heading name
$( table2.column(3).header()).text( 'new text' );
I want 'new text' to have the same styling as used in the earlier table heading (<th class="rotate">

Product Name

</th> )

in this case, PRODUCT NAME is changed to NEW TEXT and I want 'new text' to inherit styling properties of 'PRODUCT NAME'

kthorngren

According to the jQuery text() docs the $( table2.column(3).header()).text( 'new text' ); statement sets the content of the element. I took your statement and built this test case for you:
http://live.datatables.net/hitudonu/1/edit

The styling is ugly and not complete but it shows that the styling remains unchanged. Click the button to execute the above code. Please update the test case to show the issue so we can help debug.

Kevin

Khalid Teli

Hi kthorngren,

Thank you! I got it working anyway. rather than .text, I used **.html **like this

$( table2.column(3).header() ).html('<th class="rotate">

New Text

</th>');

css used:
<style>

th.rotate {
/* Something you can count on */
height: 100px;
white-space: wrap;
}

th.rotate > div {
transform:
translate(10px, 40px)
/* 45 is really 360 - 45 /
rotate(270deg);
width: 30px;
}
th.rotate > div > span {
/ border-bottom: 1px solid #ccc;
*/
padding: 0 45px ;}

</style>