Dynamic Datatable column Header
by Pankaj Sapkal
HTML
<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
<script src="https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script>
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.12/css/jquery.dataTables.min.css">
<table id="example" class="display" cellspacing="0" width="100%">
</table>
JavaScript
var dataSet = [{
"Latitude": 18.00,
"Longitude": 23.00,
"Name": "Pune"
}, {
"Latitude": 14.00,
"Longitude": 24.00,
"Name": "Mumbai"
}, {
"Latitude": 34.004654,
"Longitude": -4.005465,
"Name": "Delhi"
}, {
"Latitude": 23.004564,
"Longitude": 23.007897,
"Name": "Jaipur"
}];
var my_columns = [];
$.each( dataSet[0], function( key, value ) {
var my_item = {};
my_item.data = key;
my_item.title = key;
my_columns.push(my_item);
});
$(document).ready(function() {
$('#example').DataTable({
data: dataSet,
"columns": my_columns
});
});