Search code examples
angularspreadjs

Remove the filter arrows from the first row in a themed SpreadJS table

I am working with SpreadJS for the first time, and am busy wrapping my head around how the table styling works. I am theming to apply styles over the entire table, but there is a funny thing happening when I do so.

Whenever I apply a theme, whether it is a custom or predefined theme, the first row of the table gets these arrows that look like a filter control. Please see the images below for clarification.

Without theme:

enter image description here

With theme:

enter image description here

I apply my theme as follows:

let rowCount = activeSheet.getRowCount();
let colCount = activeSheet.getColumnCount();
activeSheet.tables.add("Table1", 0, 0, rowCount, colCount, GC.Spread.Sheets.Tables.TableThemes.light1);

Does anyone have any advice to prevent the first row from having these filter arrows applied?

Solution

  • I am a member of GrapeCity’s technical engagement team. You can use SpreadJS’s filterButtonVisible method to set whether the table column’s filter button should be displayed. You would apply this like so:

    let rowCount = activeSheet.getRowCount();
let colCount = activeSheet.getColumnCount();
var table = activeSheet.tables.add("Table1", 0, 0, rowCount, colCount, GC.Spread.Sheets.Tables.TableThemes.light1);
// removes table filters
table.filterButtonVisible(false);

    Here is a link to a sample showing this: https://codesandbox.io/s/sjs-angular-table-remove-filters-s1h8o?file=/src/app/app.component.ts:1726-1727