jQuery Datatables: How do I extract the row header titls?

Question

EDIT: This only happens when I'm using sScrollX. -- http://jsfiddle.net/4n3Hp/ -- Unfortunately, it's needed for this particular use case.

As tabletools doesn't work for me, due to its use of flash and some suboptimal behaviors for my situation, i'm trying to write an excel export. I've extracted all of the necessary cell information, but DataTables is doing something weird with the header.

Assuming a div of listTable (which is generic, but works for an example) I've tried

$('#listTable').dataTable().fnSettings().nTable.getElementsByTagName('thead')

which gets me the table header row, except it's been changed.

<th class="sorting" role="columnheader" tabindex="0" 
aria-controls="listTable" rowspan="1" colspan="1" 
style="width: 130px; padding-top: 0px; padding-bottom: 0px; 
border-top-width: 0px; border-bottom-width: 0px; height: 0px;" 
aria-label="Email Recipients: activate to sort column ascending"></th>

Which would be fine, except the original header text has been removed, the exact thing I need.

Looking at the DOM, it shows there being two actual tables, one of which has the cell data, and a new one encapsulated with a "datatables_scrollHeadInner" classed div. (If I have multiple tables on a page, this is problematic when providing a general solution.)

While I think I have a hackaround solution (pull from the aria-label and separate by colon, and never use a colon in a header; or do some awkward jquery navigation), I'd like to know how I can more elegantly extract the headers from a dataTable.

Bumptious Q Bangwhistle · Accepted Answer · 2020-01-15 08:00:18Z

7

Try this to get the header row:

var nRow =  $('#myDataTable thead tr')[0];

The column heading name will be in nRow.cells[index].innerText.

See this jsFiddle: http://jsfiddle.net/h3U7f/

Edit For sScrollX
Try this:

var columns = $('#myDataTable').dataTable().dataTableSettings[0].aoColumns;
$.each(columns, function(i,v) { alert(v.sTitle); });

See: http://jsfiddle.net/UCYCt/

edited Jan 15, 2020 at 8:00

answered Apr 21, 2013 at 17:56

Bumptious Q Bangwhistle

4,7592 gold badges36 silver badges46 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

ebiester Over a year ago

This only happens when I'm using sScrollX. -- jsfiddle.net/4n3Hp -- Unfortunately, it's needed for this particular use case. Yes, normally your solution works, and it seems that sScrollX is the culprit. Unfortunately, I can't get away from it in my particular situation.

Collectives™ on Stack Overflow

jQuery Datatables: How do I extract the row header titls?

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related