Custom JSON format
Custom JSON format
Hi,
We are working on a new version of our product list using datatables. Our current version uses a JSON object but it is hampering us in several ways:
- Repeating the column name in every row bloats the file
- There is metadata we would like to embed in the file in order to control aspects of the table, e.g. which columns appear and in what order when you select a particular tab
We had a thought wherein we would provide a top-level object to datatables which has several sub-objects and arrays that map to each other, e.g.:
{
"columns": [
{"name":"ticker", "label":"Ticker", ...},
{"name":"fundSeriesName", "label":"Fund Name"},
{"name":"seriesCurrency", "label":"Currency"},
],
"tabs":[
{"name":"overview", "label":"Overview", columns: ["ticker", "fundSeriesName", "seriesCurrency"]},
{"name":"performance", tabs:[{"name":"discrete", columns:[...]}]}
],
"data": [
["TICKER1", "Ticker 1 Desc", "USD", "07-Aug-20015"],
["TICKER2", "Ticker 2 Desc", "USD", "01-Aug-20015"]
]
}
Columns are defined in the columns object and correspond to the order of the datapoints in the data array and columns are mapped to respective tabs and in their required order in the tabs object.
For the tabs object we would either use the columns.visible option to turn or off columns per tab, or use the json as a reference for setting CSS display settings on the datatable's columns. As for column ordering, I assume we would have to redraw the table in order to change that.
Is it possible to utilize such a JSON object to accomplish all of this? How would I even begin?
Thanks,
Dylan
Replies
Hi Dylan,
At the moment, the primary way of doing this is to use
ajax.dataSrc
to convert the JSON data received into a format more like what DataTables expects (i.e. the data for each row contained in the object for that row).It is possible to use
columns.render
as a function and you can therefore use it as a look up - you would need to save the JSON (again usingajax.dataSrc
) to a variable that the rendering function can access and then perform the look up. This works nicely - the only disadvantage is you need to be a little bit more aware of what the code is doing - it isn't quite so contained.Allan