Stack Overflow
Stack Overflow

Questions tagged [react-table]

React Table is a lightweight, fast and extendable datagrid built for React.

Tanstack table for react

Headless UI for building powerful tables & datagrids.

Supercharge your tables or build a datagrid from scratch while retaining 100% control over markup and styles.

Features

  • Lightweight (10 - 15kb)
  • Tree-Shaking
  • Headless
  • Cell Formatters
  • Auto-managed internal state
  • Opt-in fully controlled state
  • Sorting
  • Multi Sort
  • Global Filters
  • Columns Filters
  • Pagination
  • Row Grouping
  • Aggregation
  • Row Selection
  • Row Expansion
  • Column Ordering
  • Column Visibility
  • Column Resizing
  • Virtualizable
  • Server-side/external Data
  • Nested/Grouped Headers
  • Footers

Resources

1381 questions
4
votes
3 answers

Why does my react table say that columns are undefined?

I'm trying to use react-table and it's throwing an error. It displays the following stack trace to the screen when I run it: It seems to be trying to create a map from the columns but throwing an error because columns is undefined. I am passing it…
gib65
  • 1,709
  • 3
  • 24
  • 58
4
votes
0 answers

Change the displayed data dynamically in react-table v7

Not sure if there is a good way to change the displayed data dynamically. For instance I would like boolean values to be displayed in the table as icons and without slowing down the rendering process too much. I'm using the latest version of…
Faisal
  • 139
  • 2
  • 10
4
votes
1 answer

Trigger re-render of subcomponent (react-table) using hooks

I'm still new to React, and functional programming, and Javascript, and JSX, so go easy if this is a stupid question. I'm modifying one of the example material-ui tables from react-table v7. The original code can be found here. The example is…
TheFunk
  • 981
  • 11
  • 39
4
votes
3 answers

React Table - radio input for useRowSelect

How can I use radio inputs instead of checkboxes for a selectable table in React Table? There is an example for checkboxes but not radio buttons: https://github.com/tannerlinsley/react-table/blob/master/examples/row-selection/src/App.js Changing the…
Alex
  • 2,651
  • 2
  • 25
  • 45
4
votes
1 answer

How to add an ID to react-table function?

I am trying to use react-table with useRowSelect, based on the tutorial. I have a REST app running at /associate but can't work out how to get the "selectedFlatRows[].original" data out of the table. Having two tables in one form also complicates…
djb
  • 1,635
  • 3
  • 26
  • 49
4
votes
4 answers

How to disable grouping on one column in react-table V7

I use the react-table example at this official codesandbox. The code for columns is like this: const columns = React.useMemo( () => [{ Header: 'Name', columns: [{ Header: 'First Name', …
user1665355
  • 3,324
  • 8
  • 44
  • 84
4
votes
1 answer

Manipulate date inside react-table

I was wondering if there is any way to manipulate a date returned from an API inside the react-table component? For example, the timestamp comes back from the API formatted as such 2019-08-31 06:27:14 ... What I would like it to look like is…
CodeSauce
  • 255
  • 3
  • 19
  • 39
4
votes
2 answers

Prevent child's state from reset after parent component state changes also get the values of all child components:ReactJS+ Typescript

I am a bit new to react and I am stuck in this situation where I am implementing custom dropdown filter for a table in react. I have set of dropdown values for each column and there is a Apply button. I have maintained a child component for this…
joy08
  • 9,004
  • 8
  • 38
  • 73
4
votes
2 answers

How to include url in react table cell

I'm trying to use an URL as hyperlink to another field in the table. ticketurl and ticketid are two different name value pairs in my JSON response. I'm trying to display ticketid, which is a hyperlink to ticketurl: data is json array [ { …
ammy
  • 306
  • 1
  • 6
  • 23
4
votes
2 answers

Search filter does not work across the react-table on setState : React JS

I am using react-table for data grid purposes. All I am trying to implement a search filter that searches data across the table and filters down by using filter method. I have maintained a separate component for Searching and I set the table's data…
joy08
  • 9,004
  • 8
  • 38
  • 73
4
votes
1 answer

How to reload/refresh a react-table component from my form component

I have two reactJS components: CustomerForm component with a form and form handling code. CustomerList component which lists the customers using react-table. Both components are functional and I can use the form to add data to the database, and…
Jatinder Thind
  • 202
  • 2
  • 3
  • 11
4
votes
1 answer

React-Table: exception thrown calling 'getResolvedState()' on component ref

I am trying to implement the download feature using React Table, the react-csv package, and TypeScript. I am trying to create and use a reference for the table component using createRef() however it is throwing the following exception "Property…
joy08
  • 9,004
  • 8
  • 38
  • 73
4
votes
1 answer

How copy state of react-table to use value of page and pageSize

I used https://www.npmjs.com/package/react-table lib. have to fetch data for a table by the filters of the column. filter below: ... filterable: true, Filter: () => { return (
kuka
  • 663
  • 1
  • 5
  • 13
4
votes
2 answers

Updating state property in componentDidMount not reflecting with react-table

Updating the state property data value in react component method componentDidMount not updating the react-table data. calling the getData in the constructor works fine. App.js class App extends React.Component { constructor() { super(); …
ida
  • 545
  • 2
  • 5
  • 20
4
votes
0 answers

react-table selectbox filtering

table plugin https://github.com/tannerlinsley/react-table how i can filter my column with select box ? eg: i have column and there is just two name Name 1 Name 2 I want to put selectbox to column for select and filtering my NAME 1 or NAME 2…
user3348410
  • 2,733
  • 10
  • 51
  • 85
1 2 3
…
92 93