My Current Task: I have Tabulator table data serialized and saved in my database. At this point in my script, I am retrieving and parsing the data. My goal is to organize the column data into an array to populate my Tabulator table, taking into account column titles and specific settings like headerSort: false.
The Challenge:
Uncaught TypeError: Cannot read property 'field' of undefined tabulator.js?ver=5.2.3:1615
at new Column (tabulator.js?ver=5.2.3:1615)
at ColumnManager._addColumn (tabulator.js?ver=5.2.3:670)
at tabulator.js?ver=5.2.3:650
at Array.forEach (<anonymous>)
at ColumnManager.setColumns (tabulator.js?ver=5.2.3:648)
at Tabulator._buildElement (tabulator.js?ver=5.2.3:9562)
at Tabulator._create (tabulator.js?ver=5.2.3:9418)
at new Tabulator (tabulator.js?ver=5.2.3:8616)
at displayEditTable (ccs-table-builder-script.js?ver=5.2.3:321)
at Object.success (ccs-table-builder-script.js?ver=5.2.3:215)
Code: ccs-table-builder-script.js
var obj = JSON.parse(data); //interprets data from the database
var rows = obj['data'];
var columns = obj['titles'];
var colArray = [];
colArray.push(columns.forEach(restructureColumns));
var editTable = new Tabulator("#ccs-editing-table", {
data:rows,
columns: colArray
}
function restructureColumns(item, index){
console.log(item.field);
console.log(item.title);
return {title:item.title, field:item.field, editableTitle:true, editor:"textarea", headerSort:false, headerClick:function (e, column) {
deleteColFunction(e, column);
}};
}
From the console.log data, I can confirm that item.field and item.title are correctly processed.
Here is an example of an item's output:
editableTitle: "true" editor: "textarea" field: "col1" headerClick: "undefined" headerSort: "false" title: "col1"[The reason for this approach is to ensure headerSort is formatted as headerSort: false instead of headerSort: "false"]
Attempts So Far: I have searched through various StackOverflow queries for similar instances, but I have not been able to apply any solutions to my own script.
I suspect the problem lies within my script rather than with Tabulator itself. Specifically, I believe the issue rests with the 'restructureColumns' function where I assign title:item.title and field:item.field.