How to add filter (filter icon) on a col header?

How to add filter (filter icon) on a col header?

Posted by: nguyenvu.work on 8 November 2024, 3:01 am EST

• 

  nguyenvu.work

  • Post Options:
  • Link
    Copy

  Posted 8 November 2024, 3:01 am EST

  • In my app, I need to create a table by spreadjs, I created headers on the spreadjs’s

    GC.Spread.Sheets.SheetArea.colHeader

    instead of

    viewport

    . When I tried to add filter, I realized I can not do that. There is no any place to determine where I want to add filter icon on like

    workSheet.addRows(1, 1, GC.Spread.Sheets.SheetArea.colHeader);

  • Please help! I need to do that in my case! Thank you all!
• 

  ankit.kumar

  

  • Post Options:
  • Link
    Copy

  Posted 8 November 2024, 4:06 am EST

  Hi,

  As per my understanding, you are adding column header rows and when using it with table filters, you are facing the issue.

  However, I tested it and it works fine. In the following sample, if you select a table cell and scoll down, the table headers will be shown in the column headers.

  If this doesn’t meet your use case, kindly do clarify your use case with an example/demo so that we could have a better understanding of your use case and could help you accordingly.

  You could refer to the following sample that I have tested with: https://jscodemine.mescius.io/share/j-m0CFeUFEmdmVfVnW2o0w/?defaultOpen={"OpenedFileName"%3A["%2Fsrc%2Fapp.js"]%2C"ActiveFile"%3A"%2Fsrc%2Fapp.js"}

  Regards,

  Ankit

• 

  nguyenvu.work

  • Post Options:
  • Link
    Copy

  Posted 8 November 2024, 7:12 am EST - Updated 8 November 2024, 7:14 am EST

  • I want to add filter on the “GC.Spread.Sheets.SheetArea.colHeader” area. ( A, B, C, D, … cells on SheetArea.colHeader ), not on the “SheetArea.viewPort”. I simply want to create a table by spreadjs and put headers on the SheetArea.colHeader for using resize column functions
• 

  ankit.kumar

  

  • Post Options:
  • Link
    Copy

  Posted 11 November 2024, 6:32 am EST

  Hi,

  Based on my understanding, you are trying to use the complete worksheet as a table and adding the rows above the current colHeaders to act as header and apply the filter on the current headers.

  However, It is important to note that the filter property is used for the cell range not for the headers. Hence, we cannot apply the filter on the headers/sub-headers. This behavior is by design and aligns with excel.

  We recommend leveraging the Table class in SpreadJS for effective table implementation, as it aligns more closely with typical table requirements and supports features like built-in filtering, styling, and structured references. The Table class ensures a more seamless experience when managing table data and properties.

  More details on how to use this can be found here: https://developer.mescius.com/spreadjs/demos/features/tables/basic-table/purejs

  If this does not meet your needs or if you have a specific use case, please share further details so we can provide more tailored guidance.

  Looking forward to your response.

  Best regards,

  Ankit