Multiple dropdown box var.columnname(0)
Multiple dropdown box var.columnname(0)

I am using multiple dropdown box with the codes below. works perfectly.
How do I print the column header where PLEASE SELECT is written.
My codes:
$(document).ready(function() {
$('#example').DataTable( {
initComplete: function () {
this.api().columns().every( function () {
var column = this;
var select = $('<select><option value="">PLEASE SELECT (+ ??var.columname +??) </option></select>')
.appendTo( $(column.footer()).empty() )
.on( 'change', function () {
var val = $.fn.dataTable.util.escapeRegex(
$(this).val()
);
column
.search( val ? '^'+val+'$' : '', true, false )
.draw();
} );
column.data().unique().sort().each( function ( d, j ) {
select.append( '<option value="'+d+'">'+d+'</option>' )
} );
} );
}
} );
} );
Answers
If you want the column name from the column definitions in the DataTable https://datatables.net/reference/api/columns().names()
If you want the actual TH values from the table header, use a JQuery selector on the column node, then get the closest TH's value. https://datatables.net/reference/api/column().nodes()
The APIs
column().name()
andcolumns().name()
are not available in Datatables 1.x. The docs state the are introduced in Datatables 2.0 which is not out yet.You will want to use
column().header()
to get the header name. The docs have an example,Kevin
I solved this problem.
It was actually very simple.
var xyz= this.header().innerHTML;
var select = $('<select><option value="">PLEASE SELECT '+ xyz+' </option></select>')
Viewing:
PLEASE SELECT ID ..
PLEASE SELECT NAME...
PLEASE SELECT SURNAME..
PLEASE SELECT SCHOOLNAME...
...
...