Stack Overflow
Stack Overflow

Questions tagged [ag-grid-react]

ag-Grid is an advanced user interface grid designed to integrate deeply into React. Questions related to this tag should target specifically the use of ag-grid with the React JavaScript library.

Github repository: https://github.com/ag-grid/ag-grid

Related tags:

1022 questions
5
votes
1 answer

AgGridReact not re-rendering on data change

I am passing rowData and columnDefs as props. Grid is loading properly. But, when the data is changed, Grid is not re-rendering. It is coming to the render of the parent component, and passed to AgGridReact. But, still not getting re-rendered.…
Jinto
  • 847
  • 1
  • 11
  • 27
4
votes
1 answer

Ag Grid react dropdown not showing outside grid

Using typeahead as cell editor for search, and in rows, and adding. The problem is, when applying the typeahead for options, will show only inside the table. I tried overflow: visible and it works that way actions-button-cell:has(.MultiColumn) { …
Cristo Ferrao
  • 83
  • 1
  • 11
4
votes
1 answer

Cell Renderer a custom componenent, keeps getting "Failed to execute 'appendChild' on 'Node': parameter 1 is not of type 'Node'."

When I try to render custom element using cell render, here is my component: Action.jsx import React from 'react'; export default (props) => (
…
Haofang Liu
  • 141
  • 1
  • 5
4
votes
2 answers

Calculated row: How to calculate cell value of the particular column based on the values from other rows in the same column using AG Grid?

I want to implement a custom calculation for the specific row using the values from other rows in the same column. I found that AG Grid provides the ability to define Column Definition Expressions and aggFunc, but they don't solve what I…
Nick
  • 177
  • 1
  • 13
4
votes
1 answer

Using complex object for grouping in Ag Grid

I am trying to use a complex object to group my ag grid rows. Object of my rowdata looks like this - const rowData= { id : '123', name: 'dummy', category: 'A', group : { name : 'dummyGroup', id : '456', category: 'A' } } Now,…
zze159753
  • 55
  • 1
  • 5
4
votes
1 answer

How to update props in Ag Grid status bar custom component

I am working on a basic Ag Grid React application, and I added a custom status bar component to the grid, using their docs. My goal is to update the "total rows" item in the status bar when a filter is applied to the grid, however I cannot get the…
Dan
  • 43
  • 5
4
votes
1 answer

How to refresh a single cell in ag-grid

I would like to refresh a single cell in ag-grid. Using the gridApi.refreshCells(). This refresh is called by a piece of code that keeps track of the current and previous cell. So what i would like to do it is to update the previous cell. I tried…
Felix
  • 41
  • 1
  • 2
4
votes
0 answers

How to test AG Grid with @testing-library/react?

To test the AgGridReact component, one must wait for the gridReady event as suggested here: https://www.ag-grid.com/documentation/react/testing/ The suggested method seems to use enzyme (?) to call mount and inspect the component's api property for…
Eric
  • 1,414
  • 3
  • 16
  • 35
4
votes
1 answer

Setting consistent rowHeight in AgGrid-React

I'm using the ag-grid-community:^24.1.0 and ag-grid-react: ^24.1.1in the react application. When I set the rowHeight as 25, it is displayed as shown below.
…
amdg
  • 2,211
  • 1
  • 14
  • 25
4
votes
1 answer

Adding styles to a specific header cell in AgGrid

I am working on AgGrid (AgGridReact component) with one of the header cells having a checkbox for 'select all' Was wondering if there is a way to pad/margin the select-all checkbox in alignment with the checkboxes in the column.
red_wolf
  • 77
  • 13
4
votes
1 answer

How to get the selection order in ag-Grid?

I'm using the grid api to get the selected rows by using the function getSelectedRows(). However, the list of rows seems to be unordered, i.e the items are not in the order I selected them in. Is there another way to get the selected rows in the…
tbr
  • 43
  • 4
4
votes
1 answer

ag-grid cell style based on dynamic condition

I am looking for dynamic rendering of cells in ag-grid based on a settable threshold value above which the cell is rendered green else red. I tried the following:
Naman Shah
  • 97
  • 8
4
votes
1 answer

What is the name of row click event in ag-grid-react reactjs?

If a user click or select a row in ag-grid then I want to fire a click event. I searched the doc but no luck.
Rahul Kant
  • 137
  • 1
  • 1
  • 9
4
votes
1 answer

ag-Grid - show buttons on row hover like in Gmail

In ag-Grid, I want to show action buttons when a row is hovered like in Gmail. The action buttons have to appear at the right end of grid irrespective of scroll position. There is one approach mentioned at…
Omkar Rajam
  • 721
  • 7
  • 13
4
votes
1 answer

Move a row to the top/bottom or at any index ag-grid react

I have been trying to move a particular row to the top of the grid, but unable to find any solution. There is a default feature (Dragging row) available in the grid, which is not needed in this case. I have added a button using cell renderer and…
Vivek Singh
  • 51
  • 3
1 2 3
…
68 69