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

continuing-cyan
continuing-cyan4/27/2023

How to enable multisorting for server side filtering?

Hey, I use react-table v8 and sort my data at server side. It works great for one column, but my server can sort by multiple columns. What's the best way to achieve the multiSort-ft with manualSorting: true ```react const table = useReactTable({...
fascinating-indigo
fascinating-indigo4/26/2023

Using Table in React Native

Hi! We are using a special framework called Solito (https://solito.dev/) that allows us to use React Native-like components to build the UI for our mobile app (iOS, Android) and web app (Next.js). Can we use the React Table implementation, or do you recommend using the Vanilla TS/JS version?
absent-sapphire
absent-sapphire4/26/2023

Any way to have default sorting order for specific columns

Is there way to have default sorting order in react table v8. by default its should be sorted in desc order
adverse-sapphire
adverse-sapphire4/25/2023

Symbols for boolean values

hello, i've got a column that is configured like this: ```ts { accessorFn: row => Boolean(row.ethernet),...
genetic-orange
genetic-orange4/24/2023

full width option?

hi m using react table for resizing on columns but its not taking full width byDefault ? how to fix this
No description
quickest-silver
quickest-silver4/23/2023

Controlled sorting and filters?

Can someone help with that?
absent-sapphire
absent-sapphire4/21/2023

Managing react state on table cells and header

Hi team, I'm developing a server side render table with row selection. I have a problem, in my current page imagine I have 10 elements, so I have a button to select all rows in the table, this 10 and rest ones So when I try to use table getIsAllRowsSelected() method return true always when I select current page but this is not real because I have manual pagination and server side rendering for my data....
foreign-sapphire
foreign-sapphire4/21/2023

I'm getting this error while creating the column headers.

Uncaught Error: Columns require an id when using a non-string header I'm sure I'm doing something wrong, but not sure what. ```js const columns = React.useMemo<ColumnDef<Customer, any>[]>( () => [...
funny-blue
funny-blue4/21/2023

How to add a custom class to a specific column header <th> tag?

I'm trying to add a class prop to a specific column header. ``` columnHelper.accessor((row) => row.id, { id: 'id',...
No description
foreign-sapphire
foreign-sapphire4/20/2023

Adding a checkbox on each row

I am new to using this TanStack table. I want to add a checkbox to the beginning of each of my table rows. So I figured out how to display the checkbox in the first column like this: ```js columnHelper.display({ id: 'actions', header: 'Select',...
dependent-tan
dependent-tan4/20/2023

svelte table does not seem to be reactive when pulling data from query

Hi guys, I have the following code ``` import { getCoreRowModel, createSvelteTable, getSortedRowModel, type TableOptions, flexRender, type ColumnDef, type Table } from '@tanstack/svelte-table'; import { createQuery } from '@tanstack/svelte-query'; import { awaitTimeOut } from '$utils/awaitSleep';...
extended-salmon
extended-salmon4/19/2023

Row locking while sorting

Hello, I am struggling to found out if React Table v7 has a feature to lock certain rows if the user decides to sort them? For example if there's a table of fruits and if the user decides to sort them in any way, apples will always be locked in the top row....
wise-white
wise-white4/17/2023

Svelte cell formatting

Hello, Using Svelte version of TanTable, I am struggling to format a cell with a background color that depends on the cell's value, like you can do with spreadsheets. I understand the need to define a cell() renderer for the specific column, but I am unclear on how to get it to work. In particular how and where to use flexRender()?...
stormy-gold
stormy-gold4/13/2023

Translate header using React and I18Next

I have a react app with i18next installed. I am using the @tanstack/react-table component. I am creating the columns in separation from the component itself in a utility file that exports the columns for this specific table ```typescript...
xenial-black
xenial-black4/11/2023

Merging cells inside columns

I am using “tanstack/react-table” v8 and my table is quite nested and sort of complicated. What I want is a expandable rows, with dynamic cell content, like a accordion. Somewhat like the one in the picture. I got the expandable logic working but I can’t find a way to style my column like that. How can I achieve such styling I tried merging cell but I couldn’t. Any help ?
No description
harsh-harlequin
harsh-harlequin4/11/2023

Is there colSpan for rows?

want to conditional take the whole row between all rows which can be achieved by spanning col in row
No description
genetic-orange
genetic-orange4/11/2023

import { useReactTable } from '@tanstack/react-table'; causes error "module not found"

Our project is NOT in typescript but I thought I could still use the module(https://stackoverflow.com/questions/73885732/how-to-implement-react-table-without-typescript) so I did yarn add @tanstack/react-table, and I can see the module has been installed but when I try to import it I receive the above mentioned error. Did anyone else run into this and if so, how did you solve this?
No description
sensitive-blue
sensitive-blue4/10/2023

React Table declaration failing to merge w/ pnpm

with the file tanstack-table.d.ts ```ts import '@tanstack/react-table';...
No description
optimistic-gold
optimistic-gold4/10/2023

Multi-select column filters? Is it possible?

Currently filter value is a string of currently selected value. Is it possible for the value to be an array? And then the table would filter based on that array.
optimistic-gold
optimistic-gold4/10/2023

Infinite scroll table - how to filter by all values(not only for the current scroll page) ?

The table is very big (5k rows) so I want to use infinite scroll, but I also want to filter by all the table - user has to be able to see all filter values. Is it possible?...