Excel-like grid component built with React, with editors, keyboard navigation, copy & paste
Questions tagged [react-data-grid]
231 questions
1
vote
2 answers
React Data Grid: Can we restrict input while editing as numeric only?
I am having a react-data-grid table which shows numeric values. But on editing any cell, we can enter any alpha numeric value. Can we restrict entry to be numeric value only?

Lini Susan V
- 1,135
- 1
- 8
- 25
1
vote
1 answer
React-data-grid giving warning when using Basic DropDownEditor
Here's the versions I'm using for react-data-grid. Running app on Chrome.
"react": "^15.4.2",
"react-data-grid": "^2.0.8",
"react-data-grid-addons": "^2.0.17",
I am replicating the Build-In-Editors example from the main website. The grid itself is…

Rajjeet
- 29
- 3
1
vote
1 answer
react-data-grid setScrollLeft is not a function - fixed columns not working - custom row renderer
I am trying to implement fixed columns in my react-data-grid.
I follow the example by adding locked: true but it doesn't work, so I also try to use a custom row rendered, like the other example.
I get _this.refs[i].setScrollLeft is not a function…

gkri
- 1,627
- 3
- 18
- 27
0
votes
0 answers
Focus issue while Enter Key press using React-data-grid
https://codesandbox.io/s/objective-shirley-88jwkj?file=/src/App.js:0-3588
Here I use MUI for Styling and Reactdatagrid.
In here when we are on last column that time if we press Enter our focus will be go to the next row's first column. But it throw…

Bobby
- 1
- 2
0
votes
0 answers
can't have multiple columns expandable in GRID_DETAIL_PANEL_TOGGLE_COL_DEF DataGridPro
I am expanding on this demo: https://mui.com/x/react-data-grid/master-detail/
It allows to have one extendable column value, but not more than one, is it possible to add more than one expandable column when using…

Patrice Loos
- 1
- 1
0
votes
1 answer
How can I implement Column Reordering using react-data-grid?
In my REACT app I'm using npm package react-data-grid. On their website they provide an example of Column Reordering. I want to do exactly the same in my code.
I checked their source code but what I don't understand is how can I import all of the…

gdv
- 13
- 3
0
votes
0 answers
Multi-column sorting in React Data Grid only sorting in ASC order
I've been struggling with this issue for a while. I would like to enable multi-column sort in react-data-grid. I cloned the repository and tried to implement a similar solution to what they had. This is what I came up with:
import DataGrid from…

Emm
- 2,367
- 3
- 24
- 50
0
votes
1 answer
How to get the filtered data from ReactDataGrid and export it in excel file?
I'm trying to export the result data of a filter using ReactDataGrid and SheetJS. So far all the data in the table is exported in the excel file when it is generated, but I want to know how can it be possible that the file is generated only with the…

Daniel
- 147
- 1
- 7
- 19
0
votes
1 answer
How to add filter to the columns using react-data-grid (https://adazzle.github.io/react-data-grid/old/docs/ReactDataGrid#columns-required)
I have been trying to figure this out for days and I have gotten nowhere. I am trying to make my table column's filterable and sortable using adazzle's react-data-grid library. This is my code. I don't know what to do next. If anyone is familiar…

EvJ
- 1
0
votes
0 answers
Adding an id or data-testid to a reactDataGrid
For clarity we are using this reactDataGrid, (https://reactdatagrid.io/)
Does anyone know if there any way to add an id or data-testid to the grid? I cannot find anything in the documentation and I I have tried anything I can think of. I…

zazvorniki
- 3,512
- 21
- 74
- 122
0
votes
0 answers
Css import fails in webpack for reactdatagrid
I added the dev dependency using the command -
yarn add @inovua/reactdatagrid-community --save
When I tried to import its required css using
import '@inovua/reactdatagrid-community/index.css';
yarn gives me the error -
ERROR in…

leoOrion
- 1,833
- 2
- 26
- 52
0
votes
1 answer
How can one set different styles for cells in selected rows in react-data-grid?
I use react-data-grid from adazzle in version 7.0.0-beta.28. My problem is that I have a table where one column should not be editable. Therefore, I want to visualise this by making the background of this column grey. Additionally, I want to have a…

marli
- 529
- 10
- 19
0
votes
1 answer
EZGrid React DataGrid showing error "Module not found: Error: Can't resolve 'react/jsx-runtime'"?
I'am on React v17 with ruby rails and receive an error like below: Cannot find module
'\jsx\node_modules\react\jsx-runtime' imported from \jsx\index.mjs Did you mean to import react/jsx-runtime.j
AS mentioned in tutorial into the below solution is…

Nitesh Minz
- 3
- 2
0
votes
0 answers
Hello all.. i need help in react-data-grid function
import logo from './logo.svg';
import './App.css';
import React, { useRef, useState } from 'react';
import "react-data-grid/lib/styles.css";
import DataGrid, { textEditor } from "react-data-grid";
import {Calendar } from "react-calendar";
const…

silly tuktuk
- 1
- 1