Questions tagged [react-data-grid]

Excel-like grid component built with React, with editors, keyboard navigation, copy & paste

Docs http://adazzle.github.io/react-data-grid/#/

Source https://github.com/adazzle/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…
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…
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…