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

correct-apricot

8/28/2023

Custom filter outside table tanstack table V8

I want to create custom column filters in outside tables like floating filters and dropdown filters with tanstack table V8 Is there any way I can achieve this functionality, ???...

sensitive-blue

8/27/2023

Unable to set undefined to pagination state

Unable to set undefined to pagination state although typescript said i can

optimistic-gold

8/26/2023

Unable to search data in nested html elements inside react-table cells

A table has a few cells with simple text in the name and age columns and a few with text inside HTML elements in the details column. The code in the link can search for texts in the name and age columns, but not in the details column. I want to make it possible to search the cells with HTML elements too. Please help me to solve this issue....

adverse-sapphire

8/25/2023

Migrating from v6 to v8 - best practices/styles

I'm trying to migrate an application's tables from v6 to v8 - I've mostly got a handle on the API changes for things like columns, but I'd like to try to find some pattern to make the migration easier from a styling/rendering perspective. I don't really love the idea of taking the six or seven places where I've got: ```ts ReactTable...

flat-fuchsia

8/19/2023

Shadcn Table - Adding rows to table body causes table body to overflow past max height in layout

I have a dynamic data table component. I would like it to take fill in a parent layout and would like the table body to be scrollable while the footer should remain on the bottom of the page. The page should ultimately not have any scroll behavior, only the table body.
However, whenever I add additional rows using the shadncn table component /pagination https://ui.shadcn.com/docs/components/table, all of the rows in the table body cause the entire html page, which was 999px in height, to expand with a table body with all the rows rendered. For the sake of example, i applied a max hieght of 800px to try to constrain the table body I am following the shadcn data table as well....

sharp-indigo

8/18/2023

Expanding Row to show non table data

Is it possible to have a row expand to show not the exact same table data, but to show arbitrary data in whatever form I'd like? So far, I've only be able to get rows to expand at all if I implement the "getSubRows" function on the table. This doesn't appear to allow me to have the data I need? Any feedback greatly appreciated. Many thanks....

harsh-harlequin

8/18/2023

What is the value added of set state functions

I don't really understand the value added of set state function. I was expecting that when I'm using setState, reset, setSorting or others the state inside the table is updated without the need to catch the update with onStateChange and call again createTable. Example with react: UseState for sorting....

xenial-black

8/18/2023

hello guys How to filter a column that was same value on search inserted tanstack table

searchInserted = "Active" result =
name status...

xenial-black

8/17/2023

Multiple filters for a single column

Is it possible to do multiple filters for a single column? As in, text input and drop down select. Text input will do a 'includes' and drop down will do an 'equal' filter.

xenial-black

8/17/2023

How to access table[firstColumn][currentRow] within ColumnDefinitions?

Consider the following code below for context. From the props provided to cell which of these should we use row.original, getValue or getAllCells to access the product located in the first column of each row, to retrieved it's ID? ```javascript const columnDefs = useMemo(() => { if (columnData) {...

ratty-blush

8/16/2023

remove Column cell when cell is out of view

Is there a benefit to remove table cells when they are out of view? Thanks

robust-apricot

8/16/2023

_i5 is not defined error

Hey I'm new here but have been using tanstack table for a while now and just recently have been running into an issue at work with it. I am using client side sort/search/pagination and tanstack version 8.7.2. Previously all our global searches were working properly but now for some reason we are running into an error only on deployed environments. When I run locally everything works as it should. The error makes no sense though it says reference error "_i5 is not defined at Object._getFilteredRo...

sunny-green

8/16/2023

How to make horizontal + vertical virtualization?

I need to make horizontal + vertical virtualization, because my table has many rows and columns + context menu which is showed on row click.

extended-salmon

8/15/2023

How to scroll tanstack table to certain column by default

I have a large table with ~15 columns, Is it possible to implement a scrollTo mechanism that will allow me to the y scroll the table to athe certain column on the initial mount? I've tried with useRef() attached to <Table> but this didn't work. I've also tried to see if it's possible by directly accessing table or its children with document.getElementsByTagName('table')[0].scrollTo(...) in the console. Unfortunately, it did not. Do you have any idea how it could be done? Thank you....

unwilling-turquoise

8/15/2023

How to disableSortRemove per column?

In our application there are 2 columns which are required to be sorted always. It would be nice if we can show that in the UI too. Is there a way to disableSortRemove per column, and not for the entire table?...

correct-apricot

8/15/2023

Undefined Value

I stored talent as ObjectId in MongoDB database. and I intend to convert it to name. but I get the value "undefined". is there anything to fix from the following code? cheers! ```js const columns = [ {...

passive-yellow

8/14/2023

Hello, using v8 how would you achieve a `onRowClick` behaviour?

Building a master/detail page whereas the master is build on react-table, I want to update the detail content each time the user click on a row. how will you achieve this?...

xenial-black

8/14/2023

Does subRows have to be the same type as row?

I'm looking to add more context to a row by having it open sort of like in the image. However, as far as I can tell the lib seems to indicate that the type of subrow must be the same type as the row. Is there any way to make a "nested group"? Cheers...

foreign-sapphire

8/14/2023

[Newbie] Table Rows won't render, header does

Hey, I'm new to using React Table and need help figuring out what's wrong with my code. The TH rows render properly, yet the actual rows don't. Here I am trying to pass in dummyData to it to no avail 😦 ```typescript ......

generous-apricot

8/14/2023

flexRender update component props

hello I have a question in svelte. I would like to update the props of different cell component based on some action. currently I use the following: ```svelte header: ()=>flexRender(Checkbox, { indeterminate, change: (e: boolean) => {...

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