Hey there, I'm currently working on incorporating the autoColumns feature in Tabulator using data retrieved via AJAX. My aim is to dynamically add column definition information based on each column's requirements, like filters, sorting, etc. Despite my attempts to include this functionality within both the pageLoaded and renderComplete callbacks, I've run into an issue where it ends up 'overwriting' the filter values entered by users when the new dataset is loaded. Is there a specific callback that would be ideal for adding this code without causing the filters to be overwritten, or would I need to read the filter values and reapply them?
Let me share an example of how I have set up the header:
var table = new Tabulator("#example-table", {
height:"600px",
layout:"fitColumns",
pagination:"remote",
paginationSize:25,
paginationSizeSelector:[10, 25, 50, 100],
paginationButtonCount:5,
ajaxSorting:true,
ajaxFiltering:true,
pageLoaded:function(pageno){
//pageno - the number of the loaded page
var columns = table.getColumnDefinitions();
//console.log(columns);
columns.forEach(column => {
//console.log(column);
column.headerFilter = "input";
});
table.setColumns(columns);
},
ajaxURL:"Pagination.php", //ajax URL
autoColumns:true
});