How to get dataTables "header name"

Question

DataTable Image -> When i am trying to get header name like this.. then i got only first column name which is NAME... But i need to get all headers name. How to get all Header Name ?

this.api().columns().every( function ($i) {
   var column = this;
   var order = this.order();
   var title = this.column(order[0][$i]).header();
   var tt = $(title).html();
   console.log(tt);
})

Answer 1

Seems a little bit overcomplicated :

this.api().columns().every(function() {
  console.log( this.header().textContent )
})

will do the "trick".

Answer 2

This worked out for me:

table.columns().header().map(d => d.textContent).toArray()

Answer 3

   Alert the name of the column for a cell that was clicked on:



var table = $('#example').DataTable();
    $('#example tbody').on( 'click', 'td', function () {
        var idx = table.cell( this ).index().column;
        var title = table.column( idx ).header();
        alert( 'Column title clicked on: '+$(title).html() );
    } );

Answer 4

var dataTableHeaderElements = $('#tableId').DataTable().columns().header();
var headers = [];
for (var i = 0; i< dataTableHeaderElements.length; i++) {
    headers.push($(dataTableHeaderElements[i]).text())    
}