ag-grid-react

问题 I have a developed a custom drop-down renderer and drop-down cell editor. When the cell is highlighted by single clicking, the following css is applied to get the effect as shown in picture .ag-cell:focus { border-radius: 5px; border: 2px solid blue !important; } I would like to have the same css on the cell when it is being edited by double clicking the cell. At present, the cell highlighting is missing as shown in the below image 来源： https://stackoverflow.com/questions/61821748/how-to-keep

问题 I have a developed a custom drop-down renderer and drop-down cell editor. When the cell is highlighted by single clicking, the following css is applied to get the effect as shown in picture .ag-cell:focus { border-radius: 5px; border: 2px solid blue !important; } I would like to have the same css on the cell when it is being edited by double clicking the cell. At present, the cell highlighting is missing as shown in the below image 来源： https://stackoverflow.com/questions/61821748/how-to-keep

问题 I'm using AG-Grid to build an react application to display data from an api like a spreadsheet. Getting the data and showing it works fine, know I want to edit the data, or change the value with a predefined list, which is also fetched through an api. This is where I'm stuck since yesterday and I can't figure it out. Here is some example code: import React, { Component } from 'react'; import { AgGridReact } from 'ag-grid-react'; class AgGridExample extends Component { constructor(props) {

问题 I'm using AG-Grid to build an react application to display data from an api like a spreadsheet. Getting the data and showing it works fine, know I want to edit the data, or change the value with a predefined list, which is also fetched through an api. This is where I'm stuck since yesterday and I can't figure it out. Here is some example code: import React, { Component } from 'react'; import { AgGridReact } from 'ag-grid-react'; class AgGridExample extends Component { constructor(props) {

问题 How can I center the text in the headers for an AG-grid control? I have tried using cellstyle and cellclass in the column definition but that did not work. Thank you 回答1: I'm using react and I just added the following snippet to my Table component's .css .ag-header-cell-label { justify-content: center; } I'm overriding the .css class class from ag-grid which I found via devtools inspection, and discovered it's using flexbox for display. See example (not react but same concept): https://embed

问题 I am trying to implement custom datepicker as cellEditor to ag-grid column of type date. When I use plain class component it works fine. But the moment I wrap it within a HoC, specifically withStyles of Material-ui, I receive a warning in console "Framework component is missing the method getValue()". I tried to follow the same sample (without required change for datepicker) given in this link -https://www.ag-grid.com/react-hooks/. But it doesn't work as well. And I receive the same warning

问题 I have this simple column: Here's its definition: { headerName: "Activité", field: "activite", editable: true, , cellClass: "cell-wrap-text" } Here's the method I want to launch every time the user enters a new input in that column. public UpdateActValue() { this.data.sendActToBia(this.params.data.activite); } Here are my questions: 1/ Are there any ag-grid "native" way to launch a particular method after a cell value from a column has been edited? 2/ Should I simply define a custom cell

问题 Initially i am displaying empty grid with header names. on click of add button new empty row should be added with delete icon.I am able to dynamically add row ag-grid.First time if i delete row after adding, its getting deleted, but second time its giving me below error.. Second time, its giving me error. Uncaught TypeError: Cannot read property 'data' of undefined Method getting calling on adding row:- createNewRowData() { let newData = { tableName: '', schemaName: '', columnName: '',

问题 I'm passing a state object in 'autoGroupColumnDef' property of ag grid. On a switch, I need to update it's value. Using setState is not helping in this case. let temp = {...this.state.autoGroupColumnDef} temp.field = "sport" this.setState({ autoGroupColumnDef : temp }) <AgGridReact columnDefs={this.state.columnDefs} defaultColDef={this.state.defaultColDef} animateRows={true} enableRangeSelection={true} rowData={this.state.rowData} autoGroupColumnDef={this.state.autoGroupColumnDef} onGridReady

问题 How to get the focused cell value at the time focussing on the cell by using the keyboard arrow keys 回答1: You can either get the focused cell by using var focusedCell = gridOptions.api.getFocusedCell(); or use the onCellFocused event. Both give you the following properties: rowIndex: number column: Column Use the row-index to retrieve the row-node: var row = gridOptions.api.getDisplayedRowAtIndex(rowIndex); After that you can use those properties to retrieve the raw value of the cell: var