Stack Overflow
Stack Overflow

Questions tagged [react-table-v6]

47 questions
37
votes
2 answers

How to show and hide some columns on React Table?

I have created a React Table. I want to hide or show some columns in my table by user action. By default all columns should be visible but we will have some check boxes to hide or show some columns. Image of my table Suppose I want to show 4 of the…
user10374052
7
votes
6 answers

How to collapse other expanded rows in react-table

I am using React Table in my project, I don't know how to close other expanded rows when user clicks one expanded, i.e. when first, second, and third rows are all expanded, I want to close all of the three when user click the fourth row. Can…
lletgo
  • 67
  • 1
  • 1
  • 2
6
votes
1 answer

React-table date range filter

I'm trying to implement a date range filter in my React-table. When I'm changing the start or end date, it triggers the filter function, creating the min and max date but when it finishes no dates are being filtered and the input is empty from the…
Shira
  • 394
  • 1
  • 6
  • 21
6
votes
4 answers

Expand subcomponent rows by default with react-table

I am using react-table to display some rows, each row has a subcomponent, which just renders some more "subrows." However, you have to click the row in order to show the subrows. React-table does not have a setting to have then expanded by default.…
Rigs
  • 163
  • 2
  • 3
  • 12
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
3
votes
3 answers

React-table how to disable client-side sorting and use just server side Sorted Data

I want to use server-side sorted Data and want to bypass react-table sorting function. I just want to use Sort click method.
Liaqat Saeed
  • 428
  • 5
  • 17
3
votes
3 answers

React-Table: Select Single Row Only, Disable Multiple Row Selection

I am using radio buttons to select the rows. How do I disable multiple row selection so only one row can be selected at a time? I am using selectedFlatRows, but it's allowing for multiple row selection. const Table = props => { const { …
SAKURA
  • 937
  • 11
  • 29
2
votes
0 answers

React-Table, disable all checkboxes after checking first 5 checkboxes?

Using Indeterminate Checkboxes.I need to disable all the checkboxes dynamically when the threshold of selected checkboxes reaches to 5(any of the five in table). function IndeterminateCheckbox({ indeterminate, className = "", …
Shivanshu Anand
  • 21
  • 2
2
votes
1 answer

React-table exclude default column filter

I have a default column filter and I'm wondering if there is a way from excluding it from one column. You can check an example from React-table that I'm using:…
Shira
  • 394
  • 1
  • 6
  • 21
2
votes
1 answer

React table - force reset page index in manual pagination

I face issue on resetting page index manually I handle change in data manually from onPageChange , onPageSizeChange ... etc when I change page index with onPageChange I stored in high-level component and pass again ReactTable as prop called…
Mina Fawzy
  • 20,852
  • 17
  • 133
  • 156
2
votes
3 answers

How can I automatically style in each cell in React Table based on the cell value generated?

I'm trying to style a table using react table based on the value of the cell, to start with I'm trying to change the background colour of each cell but what I've got based on the react table api documentation and adding getProps() to the column…
VixGraves
  • 21
  • 1
  • 1
  • 4
2
votes
2 answers

Icons in react-table

I've been struggling to find how I could display an icon in a Cell in a ReactTable (from the library react-table). All I could find is that it accepts HTML symbols. There's a lot of symbols, but what I'm looking for is to show flags... Cell: () =>…
Orlyyn
  • 2,296
  • 2
  • 20
  • 32
1
vote
2 answers

How to add value to custom Input Field in React Table Library

I have created a products table. The table has an input field for quantity where the user can add a quantity for a specific product and then add it to the cart. However, when I type in the input field the values keep disappearing. I was able to get…
node dev
  • 11
  • 3
1
vote
0 answers

Disable default pagination in react table without affecting the default sorting function

So I have a react table that renders data from serverside with pagination enabled. Initially, I has the manual attribute set to false which makes react auto generate the pagination data. At this point, the sorting was okay too. As that would not…
emmaakachukwu
  • 515
  • 1
  • 7
  • 16
1
vote
0 answers

How to sort only one column at a time using react-table?

This is the table I have right now. The problem is that when I want to sort for example the column "Driver" all other columns get sorted as well. I want to be able to sort them one at a time and only when clicked. import './Table.css' import {…
VicK
  • 11
  • 2
1
2 3 4