I was wondering if this issue has happened to anyone else whilst using tabulator.

I'm trying to create a table with the headerFilter set to select. i.e., inside the column Definitions: {title: 'title', headerFilter:'select'...}.

The issue that I am having is that when setting {headerFilter:'select', headerFilterParams: {values: true}} this returns every possible filter option for the column. I'm aware this is probably the intended function of {values: true}, but I was wondering whether there is a way of only showing the option to filter on the data currently in the table (i.e., the filtered data).

I looked through the Tabulator documentation, and I cannot find anything related to the problem I'm having.

I did however create my own function to do this for me: which can be found here (Codepen.io). Uncommenting lines 30-32 will activate the function that I have created. There are issues with it. This codepen also showcases the two issues that are being mentioned. Aside being spaghetti code:

1. When using {frozen:true} in the column definitions, I'm getting the error: Uncaught TypeError: Cannot set properties of undefined (setting 'position') relating to FrozenColumns.js (line 295) element.style.position = "absolute";.

2. When adding values to headerFilterParams from the filtered data in the table. I suspect this is an issue with the object keys getting overwritten, instead of merging them together. But before I go down the route of trying to concatenate object with duplicates into one entry, I wanted to make this post.

If anyone could help me with any of these issues / inform me of a much easier and cleaner way to implement this function - it would be GREATLY appreciated. I've spent too many hours on trying to wrap my head around this issue.

Tabulator: v5.1.6. jQuery: v.3.6.0

Thanks all in advanced :)