TanStack

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

Join

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

conscious-sapphire

3/28/2025

Working with Row Selection State

So I have a hard time managing the Row Selection State manually: ```javascript onRowSelectionChange: (selection) => { const selectedRows = selection();...

continuing-cyan

3/28/2025

Virtual columns with pinned columns

I haven't so far seen and example of pinned columns working with virtual columns, is there one out there? The main problem is that the pinned columns get removed when they are supposed to become "virtual". I have played with the rangeExtractor with mixed results. Has anyone done this before successfully? I can post links to my code so far if helpful 🙂...

conscious-sapphire

3/27/2025

Intended way of lifting up selected rows

I'm still new to this but I'm not finding a nice way to lift up selected rows to a parent and then to different component. For example, I have a parent container component, which contains a modal component and the table component. Selected rows should be visible in the modal. So my idea was it, to setup a useEffect with [table, rowSelection] dependencies. In the parent component I would write the selected rows to another state variable and move it to the modal, but it immediately creates a rendering loop. I've also tried to instead write the selected elements to context, but it has the same problem. What is the intended way of lifting information like this up? Can I instead of using an effect to observe this "event" access the events differently?...

conscious-sapphire

3/27/2025

Cell formating

Hello! Very new to this lib. May be a basic question, sorry. I am not sure why, but cell formatting just doesn't work? ```javascript columnHelper.accessor('profileNumber', {...

genetic-orange

3/27/2025

sort by rowSelection

Hello, I am a bit confused on how to sort by rowSelection. Can someone point me in the right direction?...

optimistic-gold

3/25/2025

Sorting within Groups

Hey all, I seem to be having a hard time figuring out how to sort within a grouped table, and I'm not sure if it's an issue with the table itself or if I'm trying to do something that the table is not built to do. I have a grouped table, and if I sort by one of the columns (not the one the data is grouped on), I'm looking to have the data within that group be sorted while the grouped column stays in order. Is that something that's possible?...

correct-apricot

3/15/2025

Accessing column meta from filterFn

I need to access a particular function passed in via column meta, to sanitize the value being filtered. ```ts export function multiOptionFilterFn<TData>( row: Row<TData>,...

mute-gold

3/13/2025

Grouping not working when use manual pagination

hi everyone, i'm encountering an issue when using manual pagination with React Table. everything works fine before implementing manual pagination, but after enabling it, the row grouping stops functioning correctly. has anyone faced a similar problem or knows how to fix this?

adverse-sapphire

3/11/2025

Row Selection is not persisting between pages

Following in the object i am passing to useReactTable const table = useReactTable({ data, columns, pageCount: pageCount,...

stormy-gold

3/8/2025

No rows are displayed in Production Build but works just fine in development server.

Hey I'm building an csv-importer. In that I'm using tanstack table to review the data with features like editable table, virtaulised table, row selection, sorting and column resizing. When i was developing in the developer server everything works fine. But after i deployed, in the production initially no rows are displayed. It is displayed as soon as i Check the select all rows checkbox in the header or use any filter. ...

message.txt

secure-lavender

3/7/2025

Passing row deeply with context?

Hello! Quick noob question: do you see any issues using a context to pass the current row deeply? Example of what I'm doing:...

rare-sapphire

3/5/2025

getGroupedRowModel crash

Hey, I am trying to use getGroupedRowModel in tanstack table with svelte. Without providing state I get an error in the console, but if I provide ``` state: { grouping: [] }...

plain-purple

3/5/2025

Range cell selection

Is this something that's achievable with Tanstack Table? Trying to figure out if I can build it myself with Tanstack Table or whether I should go with AG Grid or Glide

continuing-cyan

3/4/2025

Ag grid implement sticky rowwith Add button on first cell

Hi guys ,I am using ag-Grid React v33 and need to implement a custom sticky row that appears immediately after the last row and remains sticky at the bottom when there are many rows. However, if there are only a few rows, the sticky row should appear only after the last row, without floating. the row should also not update on row height change. just like this any ideas or tips?...

sensitive-blue

3/2/2025

Is there way to filter the selected rows?

Do I need use selection api to reset the table data?

conscious-sapphire

2/28/2025

columns accessors defined inside group gets wrong types

info.getValue() type resolves to any instead of correct type, if the accessor is defined in column group. For example: ```tsx const colHelper = createColumnHelper<{name:string}>(); ...

absent-sapphire

2/26/2025

Secondary key for sorting

Is there a built-in mechanism to have all columns be secondarily sorted by another specific column. In other words, if I have columns A, B, C, D, then if I sort by A, B, or D, I want all equal values to be sorted by C. Of course, if I sort by C, then it just sorts itself independent of other columns. I was looking at the multi-sort functionality, but it doesn't seem to cover the above use-case, or does it?...

like-gold

2/25/2025

Issue: Sorting null values to the bottom in @tanstack-table

Hello everyone! I hope you're all doing well. I've been struggling with a sorting issue in @tanstack-table for a few days and haven't found a solution yet. I'm sorting a table on the client side, but when some users have null names and I apply descending (desc) sorting, these null values appear at the top of the list. Ideally, I would like them to always be placed at the bottom, regardless of the sorting direction, so they don't interfere with the natural order of the data....

xenial-black

2/23/2025

custom vue data table component

I am trying to make a reusable DataTable component with vue, and feel like i'm making things harder on myself. This is the code I've come up with: ``` import { valueUpdater } from "~/lib/utils"; const {...

adverse-sapphire

2/22/2025

dnd Kit and Virtualizer in rows

In rows cant be to do both virtualisation and drag & drop. Both are applying same "tr" tag. it only have one ref to set at a time....

Previous Next

Gaming

Programming

TanStack

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

TanStack

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