ag-grid-react

Clickable url value in ag-grid with react

佐手、 提交于 2020-01-11 08:48:30
问题 I'm currently giving ag-grid a try and trying to build a table where if the user clicks a column value, they are taken to a page containing that entry's details. How can I make a cell value clickable in ag-grid? I've tried using valueGetter: this.urlValueGetter with columnDefs and: urlValueGetter(params) { return '<a href=\'bill/' + params.data.id + '\'>details</a>'; } but it now looks like this: I then tried using template: '<a href=\'bill/{id}\'>details</a>' which does show the cell text as

How to customize autoGroupColumnDef's headerGroup cell?

流过昼夜 提交于 2020-01-06 18:08:19
问题 I have a AG-grid set up with autoGroup and other column groups. I am able to set the group names on the other columns but not the first column, which is the auto group. How do I access the first cell? In the plunker example, the cell above 'test'. https://plnkr.co/edit/LgOOxMJpGwDcMdIq4Y5j?p=preview <AgGridReact // autoGroupColumnDef={this.state.columnDefs} columnDefs={this.state.columnDefs} frameworkComponents={this.state.frameworkComponents} rowData={this.state.rowData} defaultColDef={this

Uncaught TypeError: this.openA is not a function at HTMLButtonElement.onclick

拈花ヽ惹草 提交于 2019-12-25 01:45:34
问题 I'm trying to add button on column definition using ag grid, but I end up getting this error always. I tried using different ways to implement button but never found a solution. Get error on Edit_1 & it creates a new http request. In Edit_2 there's no response. Is there any other way to add button in ag grid. import React from 'react'; import ReactDataGrid from 'react-data-grid'; import { AgGridReact } from 'ag-grid-react'; import 'ag-grid-community/dist/styles/ag-theme-material.css'; import

How to always show the horizontal scroll bar in ag-grid?

好久不见. 提交于 2019-12-23 02:33:08
问题 Is it possible to always show the horizontal scroll bar in an ag-grid? This question was asked as an issue on their GitHub page, but they seem to have ignored it (best I can tell, it was not created in their own issue tracker). I'm open to official solutions, CSS hacks, anything that works really. 回答1: You could set it by CSS .ag-body-viewport-wrapper.ag-layout-normal { overflow-x: scroll; } For live example, refer to this Plunk Try removing columns from column-menu and you'll see that

this.gridApi.refreshInfiniteCache() is not clearing selectedRows

纵然是瞬间 提交于 2019-12-11 22:54:32
问题 I am using Infinite Row Model and when i deleted the selected row from Grid then i am calling refreshing cache so lets say i deleted the selected id = 1 but after refreshInfiniteCache() ; new row comes from DB via getRows() its id = 2 and that selected row does not get un-select auto and if i am clicking on delete button again then I am getting two rows in selectedData. Why is that? from this.gridApi.getSelectedRows() and getSelectedNodes() i am getting two rows previous row id = 1 and next

Ag-grid full width rows does not appear to work with React Components

我只是一个虾纸丫 提交于 2019-12-11 06:23:29
问题 I am not sure if I am doing something wrong here or if the documentation is wrong or misleading. I am trying to use the FullWidthRowCell feature for detail panels for each row. However, it appears not to completely work as documented. As I recently made the jump from v4 to v6 of ag-grid, I thought I would ask here if I was in error before making a bug report of this. Description: I changed an existing data grid so that I would potentially have a details panel that expands out to show

agGrid in react + redux app is modifying underlying data

余生颓废 提交于 2019-12-02 15:35:46
问题 I'm using latest agGrid enterprise in react + redux app. The issue is that I'm using built in editing of agGrid and this is modifying directly underlying data i.e. array that is returned from redux store. This is breaking immutability principle. Is there way to use/configure agGrid no to modify the data but to: react to change and call some callback with info about the change then I could update redux store (one item in the array) then agGrid could detect that only single object in array got