Excel-like grid component built with React, with editors, keyboard navigation, copy & paste
Questions tagged [react-data-grid]
231 questions
2
votes
1 answer
React Data Grid - Adding custom copy paste functionality with multiple tables
Need help figuring out how custom copy / paste functionality can be implemented for multiple React Data Grid tables in a single page. As per below code, copy / paste is being triggered for both the tables.
import { connect } from…
Himavanth
- 400
- 5
- 15
2
votes
1 answer
How can I manage multiple setState calls in the same React component?
I am using an npm package for creating a data grid. This datagrid is a class component and comes with rows as state. I am also trying to add inputs above the data grid that allow users to change the values of these inputs while also changing the…
George Adams
- 39
- 1
2
votes
1 answer
ReactDataGrid : why am I getting this error TypeError: undefined is not an object (evaluating 'rows.length')
I'm trying to create a ReactDataGrid and I'm getting this error when I use rowGetter. The grid works fine when I use rows={myData} though, and I really don't understand what is happening.
Here's my code :
import React, {Component, useState } from…
Tibo
- 621
- 1
- 8
- 24
2
votes
1 answer
React Data Grid fails at src/DataGrid.tsx:268 throwing a : TypeError: rows is undefined
I am using the example code provided on the React Data Grid website at https://adazzle.github.io/react-data-grid/docs/examples/simple-grid without any changes :
import React from "react";
import ReactDOM from "react-dom";
import ReactDataGrid from…
philippe
- 21
- 2
2
votes
4 answers
React Data Grid shows bad
I have a problem with ReactDataGrid component. I have already installed react-data-grid. The code is the same as in the reac grid's web:
const columns = [
{ key: 'id', name: 'ID' },
{ key: 'title', name: 'Title' },
{ key: 'count', name:…
Agustin Baldini
- 21
- 2
2
votes
0 answers
npm start error this program is blocked by group policy
I have created one example react application for react-data-grid .I am executing this application using node.js npm command. Initially i was able to run npm start and able to see the grid. Suddenly npm start stopped working . It is giving below…
Naresh Punna
- 109
- 1
- 1
- 10
2
votes
1 answer
Doing validation on certain columns in React-Data-Grid
I want to implement validation on react-data-grid table, in which only cells which i defined in the column itself will be validated, and validation only occurs if the state is set to true.
So i have the following codes here
const [ validateMode,…
Fred A
- 1,602
- 1
- 24
- 41
2
votes
0 answers
How to add infinite scroll functionality in ReactDataGrid ? Reactjs
Can anyone guide me how to add infinite scroll in react data grid ? Any clue.
Usman
- 125
- 3
- 10
2
votes
0 answers
How do I add a HeaderRenderer to react-data-grid?
I'm working with react-data-grid, which for the most part is exactly what I need. However, I have about 70 columns that need to be editable, but whose content is actual quite narrow. I'd like to display the headers vertically.
I've read through the…
Dycey
- 4,767
- 5
- 47
- 86
2
votes
1 answer
Is there a way to disable cell dragging in the react-data-grid?
I'm making editable table with react-data-grid. In react-data-grid seems like feature for editing single cell and dragging it (therefore updating multiple cells) with cell handle (similar to Excel) are coupled. Is there a way to let editing cell by…
mindSurf
- 55
- 6
2
votes
1 answer
Basic Filtering in react-data-grid
I am recently exploring "react-data-grid" a bit more and trying to get the Basic Filtering feature working in my React app. This is their Basic Filtering example I am looking…
Zim
- 21
- 1
- 4
2
votes
2 answers
React style grid row on condition
I'm using React Data Grid (https://devexpress.github.io/devextreme-reactive/react/grid/) to display data.
Everything works fine, but I would like to add custom styling (change background color) to a particular row if a value like 25 is between…
Webdeveloper_Jelle
- 2,868
- 4
- 29
- 55
2
votes
0 answers
How to test function component with a react-data-grid
I have created a data grid with react using React-data-grid (link)
My code is as follows:
import React, { useState } from "react";
import ReactDataGrid from 'react-data-grid';
const ROW_COUNT = 20;
const MIN_WIDTH = 100;
const…
Kristian
- 130
- 2
- 12
2
votes
1 answer
How to render react-data-grid in non index file with exporting?
I am using react-data-grid for rendering data but it's only working in the index.js file but when I am using in normal file I am not able to export the file by defining class & also with the function name.
Tried exporting with class name & function…
Krishna
- 23
- 2
2
votes
1 answer
React data grid custom editor work with semantic ui calendar date picker (dateinput)
I was trying to implement a custom editor for a row in my react data grid which I wish to let user input from a calendar instead of typing.
I came up something which keeps returning invalid dates.
index.js
import React, { Component } from…
MJ Tsai
- 161
- 1
- 13