I am a novice developer and have come across a Json object whose contents I am not familiar with, which I need to incorporate into Tabulator.
In order to do so, I must provide details for each column. For example:
var JSONData =[{A:12,B:3,C:13},{A:5,B:23,C:3},{A:1,B:30,C:103}]
var tabulator1 = new Tabulator("#table", {
data:JSONData,
columns:[
{title:"A", field:"A", sorter:"string",align:"right", editor:true},
{title:"B", field:"B", sorter:"string",align:"right", editor:true},
{title:"C", field:"C", sorter:"string",align:"right", editor:true},
],
});
While this approach works for known JSON Data, what if
var JSONData =[UNKNOWN LIST OF JSON DATA ]I can determine the column headers using Object.keys(JSONData[0]));. I could then default to defining the columns as follows:
{title:"A", field:"A", sorter:"string",align:"right", editor:true},
However, how can I dynamically loop through the unknown JSONData and add it to columns:[]?
At the very least, I will need to include title and field data for Tabulator to function properly.
Another possible solution is to utilize flask-jinja2 to iterate through the data on the backend, but I prefer to minimize dependency on server resources as much as possible.