javascript - Create dataTable column definition from uploaded csv data -

m trying create datatable out of uploaded csv file. problem i'm facing defining table column header. have done this, defining header manually.

var table = $('#example').datatable({     columns: [{           "title": "number",           "data": "number"       }, {           "title": "category",           "data": "category"       }, {           "title": "assignment group",           "data": "assignment group"       }       ] 

});

and passing csv data through jquery csv

 var f = event.target.files[0]; if (f) {     var r = new filereader();     r.onload = function(e) {         console.log("on load function");         var result = $.csv.toarrays(e.target.result);         table.rows.add($.csv.toobjects(e.target.result)).draw();     }     r.readastext(f); } else {     alert("failed load file"); } 

this working fine. want define column header directly csv file itself.

tried

 var f = event.target.files[0]; if (f) {     var r = new filereader();     r.onload = function(e) {         console.log("on load function");         var result = $.csv.toarrays(e.target.result); // give csv rows         var csvheader = result[0]; // give first csv header         var option;         $.each( csvheader, function( value ){            console.log(value)            // iterate each value define datatable column            option = // define column  create below column definition              /* columns: [{                          "title": "number",                          "data": "number"                      }, {                          "title": "category",                          "data": "category"                      }, {                          "title": "assignment group",                          "data": "assignment group"                      }, {                           "title": "short description",                           "data": "short description"                       },                       {                           "title": "description",                           "data": "description"                       }                      ]*/           });           var table = $('#example').datatable({            //define datatable passing column definition option          });            table.rows.add($.csv.toobjects(e.target.result)).draw();     }     r.readastext(f); } else {     alert("failed load file"); } 

thanks in advance.

any reason using filereader instead of $.get or similar? filereader not supported browsers, ie9 , opera mini.

anyway - since read csv file, , end arrays of strings ready added table, there no need defining data properties in columns. in fact takes few simple steps generate datatable showing csv using $.csv. below code takes any formed csv , publish datatable :

$.get(<csv file>, function(csv) {     var data = $.csv.toarrays(csv),         columns = [];      //create columns object     data[0].foreach(function(col) {         columns.push({ title: col });     })      //remove csv header row convenience      data.splice(0,1);      //create datatable     var table = $('#example').datatable({         columns: columns     })      //insert rows     data.foreach(function(row) {         table.row.add(row).draw();     })  })