Load table from json or another html file

HaipengSu

Hi,
It is the first time that I use dataTables, and I found it is a very handle and beautiful tool to deal with tables. The examples are very helpful to understand how to use dataTables, and I have been learning much.

I tried to do something as described as following,

I build a python program to generate a DataFrame with over 50 columns once every day, and then I would like to show the data in a html page, I am thinking two methods,

1. I can easily output the DataFrame to a JSON file, and part of the data in the file looks like,
   " [
   {\"Make\":\"ACURA\", \"Model\":\"ILX\",\"Year\":\"2013\",\"VehicleCount\":1,\"Cranking voltage\":100.0,\"Cumulative trip fuel used\":100.0,\"Cumulative trip idle fuel used\":100.0,\"Engine coolant temperature\":100.0,\"Engine speed\":100.0,\"Gear position\":100.0,\"Total fuel used\":100.0,\"Trip fuel used\":100.0,\"Vehicle active (idle or driving)\":100.0},
   {\"Make\":\"ACURA\",\"Model\":\"ILX\",\"Year\":\"2016\",\"VehicleCount\":1,\"Cranking voltage\":100.0,\"Cumulative trip fuel used\":100.0,\"Cumulative trip idle fuel used\":100.0,\"Engine coolant temperature\":100.0,\"Engine speed\":100.0,\"Gear position\":100.0,\"Total fuel used \":100.0,\"Trip fuel used\":100.0,\"Vehicle active (idle or driving)\":100.0},
   {\"Make\":\"ACURA\",\"Model\":\"MDX\",\"Year\":\"2005\",\"VehicleCount\":1,\"Cranking voltage\":100.0,\"Cumulative trip fuel used\":null,\"Cumulative trip idle fuel used\":null,\"Engine coolant temperature\":100.0,\"Engine speed\":100.0,\"Gear position\":100.0,\"Total fuel used\":null,\"Trip fuel used\":null,\"Vehicle active (idle or driving)\":100.0}
   ] "

   then, I hope that I can load the JSON file as DataTable using something like,

   var table = $('#example').DataTable( {
   ajax: "data.json"
   } );

   but not working, and the columns name might be changing every time the data is updated. so is there a way to automatically scan the column names and load as a dataTable?

2. Also, I can output the Dataframe to a html file, which is a table format and it works good, but the html file that contains the table is standing alone, so is that possible to import this html table to another html file, so that I can use DataTable to manipulate it?

which method is more reliable? and how to solve it?

Thank you so much.

HaipengSu

Maybe any other good ideas or thoughts?

droshi

To get it to parse, by default it will need to be in a "data" object. You can change this variable with "dataSrc" under ajax options. So your structure would look like:

{
   "data":[
      [..row data..]
   ]
}

Also, to avoid using just column order, you may want to set your "columns" data option:
https://datatables.net/reference/option/columns.data