get id (CSS) on complex headers using rowspan and colspan
get id (CSS) on complex headers using rowspan and colspan
madmike
Posts: 30Questions: 4Answers: 0
Hello,
Using the following code on click, to get the table header column CSS id (second thead tr th)
var pos = oTable.fnGetPosition( this );
var pos_row = pos[0];
var pos_col = pos[2];
var col_header = oTable.column( pos_col ).header();
var col_id = $(col_header).attr('id');
If I click first column of the data grid, i receive "b-col2-a", but how to obtain upper tr th CSS id corresponding ("a-col2") ?
<table>
<thead>
<tr>
<th rowspan="2" id="Name">Name</th>
<th colspan="2" id="a-col2">col 2</th>
<th colspan="2" id="a-col3">col 3</th>
</tr>
<tr>
<th id="b-col2-a">sub col b1</th>
<th id="b-col2-b">sub col b2</th>
<th id="b-col3-a">sub col b1</th>
<th id="b-col3-b">sub col b2</th>
</tr>
</thead>
...
Thanks for your help
This discussion has been closed.
Replies
I feel alone, no ideas ???
Sorry that you feel alone.
I could suggest other ways of doing this so you don't have to grab the ID of the top row. For instance, when constructing the 2nd header, add an attribute data-firstID="..." the ID of the first row.
Then, your on click event would be something like this.
myID = $("#mytableID").columns($(clickedObject).closest("td").index()).header()).attr("data-firstID");This isn't something that DataTables itself presents an API for, so either you'd need to just jQuery/DOM to traverse the header cell or using something like glenderson suggests.
Allan