Framework:Javascript GridAngular GridReact GridVue Grid

Vue Grid: Grid Callbacks

All of these grid callbacks are available through the GridOptions interface.

Callbacks

isExternalFilterPresent
Function
Grid calls this method to know if an external filter is present.
isExternalFilterPresent = () => boolean;
doesExternalFilterPass
Function
Should return true if external filter passes, otherwise false.
doesExternalFilterPass = (node: RowNode) => boolean;
getRowClass
Function
Callback version of property rowClass. Function should return a string or an array of strings.
getRowClass = (params: GetRowClassParams) => GetRowClass;

interface GetRowClassParams {
  data: object;
  node: RowNode;
  rowIndex: number;
  $scope: object;
  api: GridApi;
  columnApi: ColumnApi;
  context: object;
}

interface GetRowClass {
  0: string;
  1: string[];
}
getRowStyle
Function
Callback version of property rowStyle. Function should return an object of CSS values.
getRowStyle = (params: GetRowStyleParams) => object;

interface GetRowStyleParams {
  data: object;
  node: RowNode;
  rowIndex: number;
  $scope: object;
  api: GridApi;
  columnApi: ColumnApi;
  context: object;
}
getRowHeight
Function
Callback version of property rowHeight. Function should return a positive number of pixels, or return null/undefined to use the default row height.
getRowHeight = (params: GetRowHeightParams) => GetRowHeight;

interface GetRowHeightParams {
  node: RowNode;
  data: object;
  api: GridApi;
  context: object;
}

interface GetRowHeight {
  0: number;
  1: null;
}
groupRowAggNodes
Function
Callback for grouping. See Row Grouping.
groupRowAggNodes = (nodes: RowNode[]) => object;
getBusinessKeyForNode
Function
Return a business key for the node. If implemented, each row in the DOM will have an attribute row-id='abc' where abc is what you return as the business key. This is useful for automated testing, as it provides a way for your tool to identify rows based on unique business keys.
getBusinessKeyForNode = (node: RowNode) => string;
isGroupOpenByDefault
Function
(Client-side Row Model only) Allows groups to be open by default.
isGroupOpenByDefault = (
    params: IsGroupOpenByDefaultParams
) => void;

interface IsGroupOpenByDefaultParams {
  rowNode: RowNode;
  rowGroupColumn: Column;
  level: number;
  field: string;
  key: string;
}
getChildCount
Function
(For Server-Side Row Model only) Allows setting the child count for a group row.
getChildCount = (data: object) => number;
processRowPostCreate
Function
Allows you to process rows after they are created, so you can do final adding of custom attributes etc.
processRowPostCreate = (params: ProcessRowParams) => void;

interface ProcessRowParams {
  eRow: HTMLElement;
  ePinnedLeftRow: HTMLElement;
  ePinnedRightRow: HTMLElement;
  rowIndex: number;
  node: RowNode;
  api: GridApi;
  columnApi: ColumnApi;
  addRenderedRowListener: (eventType: string, listener: Function) => void;
  context: object;
}
getRowNodeId
Function
Allows you to set the ID for a particular row node based on the data. Useful for selection and server side sorting and filtering for paging and virtual pagination.
getRowNodeId = (data: object) => string;
isFullWidthCell
Function
Tells the grid if this row should be rendered as full width.
isFullWidthCell = (node: RowNode) => boolean;
isRowSelectable
Function
Callback to be used to determine which rows are selectable. By default rows are selectable, so return false to make a row un-selectable. See Specify Selectable Rows.
isRowSelectable = (node: RowNode) => boolean;
isRowMaster
Function
Callback to be used with Master Detail to determine if a row should be a master row. If false is returned no detail row will exist for this row.
isRowMaster = (data: object) => boolean;
postSort
Function
Callback to perform additional sorting after the grid has sorted the rows. See Post Sort.
postSort = (nodes: RowNode[]) => void;
navigateToNextHeader
Function
Allows overriding the default behaviour for when user hits navigation (arrow) key when a header is focused.
navigateToNextHeader = (
    params: NavigateToNextHeaderParams
) => HeaderPosition;

interface NavigateToNextHeaderParams {
  key: string;
  previousHeaderPosition: HeaderPosition | null;
  nextHeaderPosition: HeaderPosition | null;
  event: KeyboardEvent;
  headerRowCount: number;
}
tabToNextHeader
Function
Allows overriding the default behaviour for when user hits Tab key when a header is focused.
tabToNextHeader = (
    params: TabToNextHeaderParams
) => HeaderPosition;

interface TabToNextHeaderParams {
  backwards: boolean;
  previousHeaderPosition: HeaderPosition | null;
  nextHeaderPosition: HeaderPosition | null;
  headerRowCount: number;
}
navigateToNextCell
Function
Allows overriding the default behaviour for when user hits navigation (arrow) key when a cell is focused.
navigateToNextCell = (
    params: NavigateToNextCellParams
) => CellPosition;

interface NavigateToNextCellParams {
  key: number;
  previousCellPosition: CellPosition;
  nextCellPosition: CellPosition | null;
  event: KeyboardEvent | null;
}
tabToNextCell
Function
Allows overriding the default behaviour for when user hits Tab key when a cell is focused.
tabToNextCell = (params: TabToNextCellParams) => CellPosition;

interface TabToNextCellParams {
  backwards: boolean;
  editing: boolean;
  previousCellPosition: CellPosition;
  nextCellPosition: CellPosition;
}
getDocument
Function
Allows overriding what document is used. Currently used by Drag and Drop (may extend to other places in the future). Use this when you want the grid to use a different document than the one available on the global scope. This can happen if docking out components (something which Electron supports).
getDocument = () => Document;
getContextMenuItems
Function
For customising the context menu.
getContextMenuItems = (
    params: GetContextMenuItemsParams
) => (string | MenuItemDef)[];

interface GetContextMenuItemsParams {
  defaultItems?: string[];
  column: Column;
  node: RowNode;
  value: object;
  api?: GridApi;
  columnApi?: ColumnApi;
  context: object;
}
getMainMenuItems
Function
For customising the main 'column header' menu.
getMainMenuItems = (
    params: GetMainMenuItemsParams
) => void;

interface GetMainMenuItemsParams {
  column: Column;
  api?: GridApi;
  columnApi?: ColumnApi;
  context: object;
  defaultItems: string[];
}
processCellForClipboard
Function
Allows you to process cells for the clipboard. Handy if for example you have Date objects that need to have a particular format if importing into Excel.
processCellForClipboard = (
    params: ProcessCellForClipboardParams
) => object;

interface ProcessCellForClipboardParams {
  value: object;
  accumulatedRowIndex?: number;
  node?: RowNode;
  column: Column;
  api?: GridApi;
  columnApi?: ColumnApi;
  context: object;
  type: string;
}
processCellFromClipboard
Function
Allows you to process cells from the clipboard. Handy if for example you have number fields, and want to block non-numbers from getting into the grid.
processCellFromClipboard = (
    params: ProcessCellFromClipboardParams
) => object;

interface ProcessCellFromClipboardParams {
  value: object;
  accumulatedRowIndex?: number;
  node?: RowNode;
  column: Column;
  api?: GridApi;
  columnApi?: ColumnApi;
  context: object;
  type: string;
}
sendToClipboard
Function
Allows you to get the data that would otherwise go to the clipboard. To be used when you want to control the 'copy to clipboard' operation yourself.
sendToClipboard = (
    params: SendToClipboardParams
) => void;

interface SendToClipboardParams {
  data: string;
}
processSecondaryColDef
Function
Callback to be used with pivoting, to allow changing the second column definition.
processSecondaryColDef = (colDef: ColDef) => void;
processSecondaryColGroupDef
Function
Callback to be used with pivoting, to allow changing the second column group definition.
processSecondaryColGroupDef = (colGroupDef: ColGroupDef) => void;
postProcessPopup
Function
Allows user to process popups after they are created. Applications can use this if they want to, for example, reposition the popup.
postProcessPopup = (
    params: PostProcessPopupParams
) => void;

interface PostProcessPopupParams {
  column?: Column;
  rowNode?: RowNode;
  ePopup: HTMLElement;
  type: string;
  eventSource?: HTMLElement;
  mouseEvent?: MouseEvent | Touch;
}
defaultGroupSortComparator
Function
Allows default sorting of groups. See Default Group Order.
defaultGroupSortComparator = (
    nodeA: RowNode,
    nodeB: RowNode
) => number;
processChartOptions
Function
Callback to be used to with charts to override default chart options. See Overriding Chart Options.
processChartOptions = (
    params: ProcessChartOptionsParams
) => void;

interface ProcessChartOptionsParams {
  type: ChartType;
  options: ChartOptions;
}
getChartToolbarItems
Function
Callback to be used to customise the chart toolbar items. See Configuring Toolbar Items.
Options: 'chartSettings', 'chartData', 'chartFormat', 'chartLink', 'chartUnlink', 'chartDownload'
getChartToolbarItems = (
    params: GetChartToolbarItemsParams
) => ChartMenuOptions[];

interface GetChartToolbarItemsParams {
  defaultItems?: ChartMenuOptions[];
  api?: GridApi;
  columnApi?: ColumnApi;
}
paginationNumberFormatter
Function
Allows user to format the numbers in the pagination panel, i.e. 'row count' and 'page number' labels. This is for pagination panel only, to format numbers inside the grid's cells (i.e. your data), then use valueFormatter in the column definitions.
paginationNumberFormatter = (
    params: PaginationNumberFormatterParams
) => string;

interface PaginationNumberFormatterParams {
  value: number;
}
getServerSideStoreParams
Function
(Server-side Row Model only) Allows providing different params for different levels of grouping.
getServerSideStoreParams = (
    params: GetServerSideStoreParamsParams
) => GetServerSideStoreParams;

interface GetServerSideStoreParamsParams {
  level: number;
  parentRowNode?: RowNode;
  rowGroupColumns: Column[];
  pivotColumns: Column[];
  pivotMode: boolean;
}

interface GetServerSideStoreParams {
  storeType?: 'full' | 'partial';
  maxBlocksInCache?: number;
  cacheBlockSize?: number;
}
isServerSideGroupOpenByDefault
Function
(Server-side Row Model only) Allows groups to be open by default.
isServerSideGroupOpenByDefault = (
    params: IsServerSideGroupOpenByDefaultParams
) => void;

interface IsServerSideGroupOpenByDefaultParams {
  data: object;
  rowNode: RowNode;
}
isApplyServerSideTransaction
Function
(Server-side Row Model only) Allows cancelling transactions.
isApplyServerSideTransaction = (
    params: IsApplyServerSideTransactionParams
) => boolean;

interface IsApplyServerSideTransactionParams {
  transaction: ServerSideTransaction;
  parentNode: RowNode;
  storeInfo: object;
}
isServerSideGroup
Function
(Server-side Row Model and Tree Data only) Allows specifying which rows are expandable.
isServerSideGroup = (data: object) => boolean;
getServerSideGroupKey
Function
(Server-side Row Model and Tree Data only) Allows specifying group keys.
getServerSideGroupKey = (data: object) => string;