Table with virtualized columns and dynamic column width #5552
Unanswered
saomartinho
asked this question in
Q&A
Replies: 1 comment 1 reply
-
Maybe just loop through column defs and set the appropriate |
Beta Was this translation helpful? Give feedback.
1 reply
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
Hello,
I'm involved in a project using the Tanstack Table and Virtual to create a table with N columns. We follow this example - https://tanstack.com/table/latest/docs/framework/react/examples/virtualized-columns.
It worked flawlessly, even when dealing with over 3,000 columns. However, this table has a behavior that allows users to toggle between showing and hiding the entire width of the columns. Initially, when a user chose to display the full width, we set all columns to the same width. You can observe this behavior in the attached video:
Screen_Recording_2024-05-09_at_12.18.53.mov
The upcoming phase will focus on adjusting the column widths to accommodate the content size when users opt for 'show full screen'. However, we're uncertain about the most effective method for achieving this. We've considered setting the column widths to 'auto', but encountered issues with virtualization. Another option was to iterate through all columns, validate text size, and adjust column size accordingly, but we're unsure if this is optimal. Your expertise in UI/UX design and front-end development could greatly help us in this matter.
I really appreciate any help you can provide.
Beta Was this translation helpful? Give feedback.
All reactions