jquery - Datatables - how to get columns of dataSrc -

so backend returning

[{"id":"371","ref":"35\/2016","creator":"name","status":"part1","username":"user","date":"2016-12-14 00:00:00","title":null,"site":null,"location":"","comment":null}] 

i saw datasrc : "" being used in example, in example: https://datatables.net/examples/ajax/custom_data_property.html conveniently don't make example of how when they're array of objects.

any tips on how use columns: [...] working appreciated.

method 1 : have here think answer.

method 2 : can parse json response , create multidimention array , pass datasrc how convert json array javascript 2d array

method 3 : can parse response , create table structure below , append div :

<table id="example" class="display" cellspacing="0" width="100%">             <thead>                 <tr>                     <th>name</th>                     <th>position</th>                     <th>office</th>                     <th>extn.</th>                     <th>start date</th>                     <th>salary</th>                 </tr>             </thead> <tbody> <tr> <td>name xyz</td> <td>position xyz</td> <td>office xyz</td> <td>extn xyz</td> <td>05-jan-2017</td> <td>10lacs</td> </tr> <tbody>             <tfoot>                 <tr>                     <th>name</th>                     <th>position</th>                     <th>office</th>                     <th>extn.</th>                     <th>start date</th>                     <th>salary</th>                 </tr>             </tfoot>         </table> 

now apply jquery code below

$('#example').datatable({                 responsive: true,                 "pagingtype": "full_numbers",                 dom: 'bfrtip',                 buttons: [                     'copy', 'csv', 'excel', 'pdf', 'print'                 ]      });