TanStack

T

TanStack

TanStack is a community of passionate software engineers striving for high-quality, open-source software for web devs

Join

react-query-questions

solid-query-questions

table-questions

virtual-questions

router-questions

react-charts-questions

ranger-questions

vue-query-questions

svelte-query-questions

bling-questions

form-questions

angular-query-questions

start-questions

db-questions

start-showcase

router-showcase

📣-announcements

conventional-tan
conventional-tan2/28/2024

Java Developer

I need Java Developer who is based in EST or PST timezone. Plz DM me. monthly paid work.
optimistic-gold
optimistic-gold2/27/2024

Grouped rows sort to the bottom after running `column.clearSorting()`

Howdy! I'm working on a table using this library in SvelteKit. I'm really enjoying it! To make my table, I'm iterating over flatRows instead of traversing through the nested rows tree. I like this because it's simpler and it makes it easier for me to write logic to render the table whether it's grouped or ungrouped....
afraid-scarlet
afraid-scarlet2/27/2024

Enable Column Pinning only to specific Column and rest columns pinning will be false? HOW??

I am using @tanstack/react-table and I see that by default enablePinning is true and if this is made false this applies to all Columns. I am fine upto this point. Now I have added enablePinning to specific column let's say to Column0 as I have already done enablePinning false now also Column0 is showing enablePinning as false. But What I want is: I want all columns to have enablePinning to false but whereever I pass enablePinning as true to the ColDef I want pinning to be true? Do someone here have any idea on this???...
foreign-sapphire
foreign-sapphire2/24/2024

Default/initial sort

Most of the existing discussion around this refers to a sortBy prop on table.initialState but that doesn't seem to exist anymore. I assume this was changed in V8? How can I have the table sorted by a particular column as soon as the table loads....
foreign-sapphire
foreign-sapphire2/22/2024

Manual pagination

I have a table that i want to be configured to fit both manual and not manual managed cases. i have something like this ```ts...
flat-fuchsia
flat-fuchsia2/21/2024

Setting proper row id

I'm using react-table and I've set row number using row.id/row.index and after sorting row numbers get's messed up. How can I deal with it?
No description
ratty-blush
ratty-blush2/21/2024

Row DnD + column visibility

Using the row dnd example, I tried adding the column visibility example code to the table. When toggling the drag handle on and off, it makes the drag handle not work. Anyone have any experience with this? Alternatively I can disable dragging on SortableContext and drag the entire row, but I would greatly prefer to use a drag handle....
ambitious-aqua
ambitious-aqua2/17/2024

using hooks in columndef

This is a snippet of my columndef, it is the last column. ```jsx { id: "actions", cell: ({ row }) => {...
metropolitan-bronze
metropolitan-bronze2/17/2024

How to add new empty row in table?

How to add new empty row in table?
optimistic-gold
optimistic-gold2/16/2024

how to group rows for this design?

I have this design with a row which groups people under a country. is that possible? Country will be like an empty line. They seems more subrows more than grouping but idk how to achieve this. there is only one header that refers to rows under the organization...
No description
eastern-cyan
eastern-cyan2/15/2024

onScroll handler

Is there any onScroll handler in the tanstack table for react?? If so, can anyone explain....
national-gold
national-gold2/14/2024

What would be the filtered rows if the globalFilter was unset?

Hello! I am using both type of filtering: globalFIlter and filtersColumn. I cannot find a way to calculate their contribution to the final result separately. To be more precise I know the globalFilter contribution by using getGlobalFacetedRowModel but I'd also like to know what would be the final result if globalFIlter was empty, that is only considering filtersColumn...
rare-sapphire
rare-sapphire2/14/2024

Tailwind Responsive Tables (and how does flexRender work?)

Hi guys, so i feel like this is a pretty simple question in my ColDef i can create headers and cells with a responsive tag: ...
No description
foreign-sapphire
foreign-sapphire2/13/2024

Dynamically change the header of a column

Is there a way to dynamicaly change the header of a column? For example, if I pass a boolean of true, I want to render a 'True' for the header, and if its false, I want to render 'False'...
metropolitan-bronze
metropolitan-bronze2/12/2024

Sorter gets stuck on columns with number value

Sorting works fine for string values but when I want to have a column with numbers it goes desc, asc, asc, asc, asc, asc......idk what is the difference. It shouldn't be doing anything with the number value, but the whole column... Its not that big of a deal with number values cause i can just do .toString() but I have some custom columns that cannot be "fixed" this way. Any ideas why this is happening?...
No description
metropolitan-bronze
metropolitan-bronze2/9/2024

different type for subRows

I came across this (unresolved) gh discussion with a couple of folks all running into a similar scenario as i currently am. Whats the move when the type being passed to getSubRows doesn't match the original exactly ? I'n my case the subRow is basically is just a subset of the original columns....
afraid-scarlet
afraid-scarlet2/8/2024

Help with TanStack Table virtualized rows and expandable

Hello, I am doing a table with virtualized rows and an expandable section, inside the expandable I'm creating a new table with some Data, I need a way to update the TBODY height when expanded and make the expanded section look aligned with the rest of the rows but i can't figure out how, heres a codesanbox with the code and some screenshots. Thanks SANDBOX...
No description
flat-fuchsia
flat-fuchsia2/5/2024

React Table virtualization

Does react table have built in virtualization? Or do I need to use react virtual if I have any virtualization needs?
adverse-sapphire
adverse-sapphire2/5/2024

Help with TanStack Table onRowClick

Hey TanStack Community, is there a way I can do <TanStackTable onRowClick={rowData => callSomeFunction(rowData.id, rowData.name)}...
correct-apricot
correct-apricot2/2/2024

Filter Reset

Can I detect when a filter has been reset via
table.resetColumnFilters()
table.resetColumnFilters()
This is my ColumnDef ```{ accessorKey: "depot", filterFn: (...