Vue Data GridUpgrading to AG Grid 30

Cell data types with automatic type inference, built-in cell editors, group footer rows when using server-side row model, export row groups to Excel with their current expanded state.

What's New Copy

AG Grid 30.0 delivers cell data types with automatic type inference along with highly-requested new features in cell rendering, editing and export to Excel, as described in the release post for details of what's new in version 30.0. These major improvements require certain breaking changes as listed below.

Documentation Copy

See AG Grid 30.0 Documentation.

Breaking Changes Copy

Typescript Upgrade

Minimum version of Typescript for AG Grid v29 is v4.3.5.
You may have type errors if a TData generic is provided to GridOptions but the columnDefs is set from an untyped external property. To resolve provide explicit type your columnDefs.

Module Registration

Modules registered individually to a grid are now only available to that instance of the grid. Previously individually registered modules were registered globally leading to a leaking of features across different grids. See Registering AG Grid Modules for more information.

Build & Deploy

In previous releases the main field of package.json defaulted to ES5 CommonJS artefacts. From v30 onwards the default will be ES6 ES Modules. For most modern build tools such as Webpack, Angular ClI, React Scripts or Vue 2/3 CLI your build should work as it did before - and should result in a smaller overall bundle size. If however you're using a more complicated build that relied on CommonJS being the default then you may need to make changes to accommodate this change.

Note that we still build and distribute both ES5/ES6 versions of both CommonJS and ES Modules.

Jest users please refer to the Testing section of the documentation for further configuration instructions.

ColDef

Certain properties defined on the defaultColDef, including valueFormatter and valueParser, will now be overridden by cell data types (which are enabled by default). See Cell Data Types for more information.

Behavior Changes Copy

Quick Filter Copy

  • When pivoting, quick filter applies to pivot and group columns only and not to primary columns anymore.

Standalone Charts Copy

General Option Processing

  • When enabled is set to false in an options object, all other configurations in that object will be ignored.

Chart Auto-Sizing

  • autoSize now does not override a specified height or width, and only applies to unset dimensions. autoSize set to false without a width and height specified, fixes the size of the canvas to its initial size.

Legend

  • The legend is now hidden by default in cartesian charts with only one series. To show the legend, use legend.enabled.
  • The default legend position is now bottom. To use a custom position, set legend.position.
  • column series legend items now follow declaration order. Use legend.reverseOrder = true to revert this ordering change if needed.
  • Pie series sectors no longer toggle when a legend item is double clicked.

Formatter Callbacks (excluding AgCartesianSeriesMarkerFormatter)

  • Chart formatter callbacks will now be deduplicated, with the intent being that we cache results for every unique permutation of parameters. The result cache is cleared on an AgChart.update() or AgChart.updateDelta() call to allow for modifications to callback behaviour to be picked up.

Navigator

  • Disabling the navigator now clears any zoom/scroll applied, rather than leaving it present. Re-enabling restores the previous zoom/scroll state.

Removal of Deprecated APIs Copy

The following API members were previously deprecated and have now been removed.

Removed Deprecated APIs

Cell Rendering

  • cellRendererFramework - removed, use cellRenderer instead.
  • Return type of cellRendererSelector property frameworkComponent removed - use component property instead.

Cell Editing

  • The CellKeyPress and FullWidthCellKeyPress events are no longer fired by the Grid. These events have been replaced by CellKeyDown and FullWidthCellKeyDown.
  • All events that had source= spacePressed or deleteKeyPressed now have the source set to spaceKey or deleteKey.
  • charPress - removed from ICellEditorParams and StartEditingCellParams. You can now detect a key press by using: if (eventKey.length === 1)
  • cellEditorFramework - removed, use cellEditor instead.
  • Return type of cellEditorSelector property frameworkComponent removed - use component property instead.
  • 'agPopupTextCellEditor' removed - use {cellEditor: "agTextCellEditor"; cellEditorPopup: true} instead.
  • 'agPopupSelectCellEditor' removed - use {cellEditor: "agSelectCellEditor"; cellEditorPopup: true} instead.

Components

  • tooltipComponentFramework - removed, use tooltipComponent instead.
  • headerComponentFramework - removed, use headerComponent instead.
  • headerGroupComponentFramework - removed, use headerGroupComponent instead.

Header Height

  • spanHeaderHeight removed and made default, use suppressSpanHeaderHeight to suppress.

ColumnGroup

  • stickyLabel removed and made default, use suppressStickyLabel to suppress.
  • getOriginalColumnGroup - removed, use getProvidedColumnGroup instead.

Column Api Copy

  • getOriginalColumnGroup - removed, use getProvidedColumnGroup instead.

GridOptions Copy

Clipboard

  • clipboardDeliminator - removed, use clipboardDelimiter instead.

Components

  • frameworkComponents - removed, use components instead.
  • loadingCellRendererFramework - removed, use loadingCellRenderer instead.
  • Return type of loadingCellRendererSelector property frameworkComponent removed - use component instead.
  • detailCellRendererFramework - removed, use detailCellRenderer instead.
  • loadingOverlayComponentFramework - removed, use loadingOverlayComponent instead.
  • noRowsOverlayComponentFramework - removed, use noRowsOverlayComponent instead.
  • fullWidthCellRendererFramework - removed, use fullWidthCellRenderer instead.
  • groupRowRendererFramework - removed, use groupRowRenderer instead.

Editing

  • stopEditingWhenGridLosesFocus - removed, use stopEditingWhenCellsLoseFocus instead.

Full Width

  • isFullWidthCell - removed, use isFullWidthRow instead.

Filtering

  • Set Filter parameter defaultToNothingSelected will be ignored when excelMode is set.
  • All browsers now use HTML number inputs for the Number Filter by default. The old behavior (in browsers other than Chrome or Edge) can be replicated by setting filterParams.allowedCharPattern = '\\d\\-\\.'.
  • serverSideFilterAllLevels - deprecated and the behavior made default. Set serverSideOnlyRefreshFilteredGroups property to only refresh filtered groups as before.
  • excludeHiddenColumnsFromQuickFilter - deprecated and the behavior made default. Hidden columns are now excluded from the Quick Filter by default. To include them, set the grid option includeHiddenColumnsInQuickFilter = true.

Grouping

  • groupMultiAutoColumn - removed, set groupDisplayType='multipleColumns' instead.
  • groupUseEntireRow - removed, set groupDisplayType='groupRows' instead.
  • defaultGroupOrderComparator - removed, use initialGroupOrderComparator instead.
  • groupRowAggNodes - removed, use getGroupRowAgg instead.
  • gridOptions.groupRowsSticky removed and made default, use gridOptions.suppressGroupRowsSticky to suppress.
  • suppressAggAtRootLevel - deprecated and the behavior made default. The root level aggregation is now suppressed by default, except when using groupIncludeTotalFooter=true. This can be toggled using alwaysAggregateAtRootLevel.

Immutable Data

  • immutableData - removed, implement getRowId() to enable immutable data mode.
  • getRowNodeId - removed, use getRowId() instead.

Localisation

  • localeTextFunc - removed, use getLocaleText instead.

Selection

  • suppressCellSelection - removed, use suppressCellFocus instead.

Sorting

  • postSort - removed, use postSortRows instead.

Row Dragging

  • enableMultiRowDragging - removed, use rowDragMultiRow instead.

Tool Panel

  • toolPanelVisibleChanged updated, see toolPanelVisibleChanged. It now fires twice when switching between tool panels (once for the old panel and once for the new panel), but has new fields to indicate the change. The source property now refers to the event source rather than the panel name.

Grid API Copy

Callbacks which had the generic TValue type may now be slightly stricter with regards to null values. See Cell <TValue>.

The following methods were previously deprecated and have now been removed.

Full Width

  • setIsFullWidthCell - removed, use setIsFullWidthRow instead.

Grouping

  • setGroupRowAggNodes - removed, use setGetGroupRowAgg instead.
  • setDefaultGroupOrderComparator - removed, use setInitialGroupOrderComparator instead.

Immutable Data

  • setGetRowNodeId - removed, use setGetRowId instead.

Sorting

  • setPostSort - removed, use setPostSortRows instead.

Selection

  • rowNode.setSelected() property suppressFinishActions - removed, use gridApi.setNodesSelected() for bulk row selection, and the event source property for ignoring events instead.

Interfaces Copy

IFilterOptionDef

  • test - removed, use predicate instead.
  • hideFilterInput - removed, use numberOfInputs: 0 instead.

ISetFilterParams

  • cellRendererFramework - removed, use cellRenderer instead.

ToolPanelDef

  • toolPanelFramework - removed, use toolPanel instead.

StatusPanelDef

  • statusPanelFramework - removed, use statusPanel instead.

IGroupCellRendererParams

  • innerRendererFramework - removed, use innerRenderer instead.

IMultiFilterDef

  • filterFramework - removed, use filter instead.
  • floatingFilterComponentFramework - removed, use floatingFilterComponent instead.

Standalone Charts Copy

Event Handlers

  • AgNodeBaseClickEvent.series removed - use seriesId instead.
  • AgSeriesNodeClickParams.series removed - use seriesId instead.

Other Breaking Option Changes

  • AgAxisCategoryTickOptions.maxSpacing has been immediately removed from our typings. This option never had any impact on axis tick selection, so this is considered a bugfix to the AgAxisCategoryTickOptions type.
  • AgBarSeriesOptions
  • flipXY has been removed without deprecation as it was redundant, and didn't work consistently - specify series type column or bar instead.
  • AgBarSeriesOptions has been updated to remove support for type of column, which has been split into a distinct type of AgColumnSeriesOptions. Aside from type name changes, their options contracts are identical, so no runtime options changes should be needed.
  • The default seriesId for column series now have a different prefix of 'ColumnSeries-' - we recommend you supply your own seriesId rather than relying on this default.
  • AgChartLegendLabelFormatterParams.id removed - use seriesId instead.
  • AgPieSeriesOptions
  • label removed - use calloutLabel instead.
  • callout removed - use calloutLine instead.
  • labelKey removed - use calloutLabelKey or sectorLabelKey instead.
  • labelName removed - use calloutLabelName or sectorLabelName instead.
  • AgPieSeriesTooltipRendererParams
  • labelKey removed - use calloutLabelKey or sectorLabelKey instead.
  • labelName removed - use calloutLabelName or sectorLabelName instead.
  • AgPieSeriesLabelFormatterParams
  • labelValue removed - use calloutLabelValue instead.
  • labelName removed - use calloutLabelName instead.
  • value removed - use item.datum instead.

Deprecations Copy

This release includes the following deprecations:

Selection

  • enterMovesDown and enterMovesDownAfterEdit deprecated. Use enterNavigatesVertically and enterNavigatesVerticallyAfterEdit instead.

Changes List Copy

If you would like to see the full list of changes in this release, please see the Changelog.