GridApi Interface

The full grid API.

Demos

Import

import { GridApi } from '@mui/x-data-grid-premium';
// or
import { GridApi } from '@mui/x-data-grid-pro';
// or
import { GridApi } from '@mui/x-data-grid';

Properties

Name	Type	Description
addRowGroupingCriteria	(groupingCriteriaField: string, groupingIndex?: number) => void	Adds the field to the row grouping model.
applySorting	() => void	Applies the current sort model to the rows.
deleteFilterItem	(item: GridFilterItem) => void	Deletes a GridFilterItem.
exportDataAsCsv	(options?: GridCsvExportOptions) => void	Downloads and exports a CSV of the grid's data.
exportDataAsExcel	(options?: GridExcelExportOptions) => Promise<void>	Downloads and exports an Excel file of the grid's data.
exportDataAsPrint	(options?: GridPrintExportOptions) => void	Print the grid's data.
exportState	(params?: GridExportStateParams) => InitialState	Generates a serializable object containing the exportable parts of the DataGrid state. These values can then be passed to the `initialState` prop or injected using the `restoreState` method.
forceUpdate	() => void	Forces the grid to rerender. It's often used after a state update.
getAllColumns	() => GridStateColDef[]	Returns an array of GridColDef containing all the column definitions.
getAllRowIds	() => GridRowId[]	Gets the list of row ids.
getCellElement	(id: GridRowId, field: string) => HTMLDivElement \| null	Gets the underlying DOM element for a cell at the given `id` and `field`.
getCellMode	(id: GridRowId, field: string) => GridCellMode	Gets the mode of a cell.
getCellParams	<R extends GridValidRowModel = any, V = unknown, F = V, N extends GridTreeNode = GridTreeNode>(id: GridRowId, field: string) => GridCellParams<R, V, F, N>	Gets the GridCellParams object that is passed as argument in events.
getCellValue	<V extends any = any>(id: GridRowId, field: string) => V	Gets the value of a cell at the given `id` and `field`.
getColumn	(field: string) => GridStateColDef	Returns the GridColDef for the given `field`.
getColumnHeaderElement	(field: string) => HTMLDivElement \| null	Gets the underlying DOM element for the column header with the given `field`.
getColumnHeaderParams	(field: string) => GridColumnHeaderParams	Gets the GridColumnHeaderParams object that is passed as argument in events.
getColumnIndex	(field: string, useVisibleColumns?: boolean) => number	Returns the index position of a column. By default, only the visible columns are considered. Pass `false` to `useVisibleColumns` to consider all columns.
getColumnIndexRelativeToVisibleColumns	(field: string) => number	Gets the index of a column relative to the columns that are reachable by scroll.
getColumnPosition	(field: string) => number	Returns the left-position of a column relative to the inner border of the grid.
getDataAsCsv	(options?: GridCsvExportOptions) => string	Returns the grid data as a CSV string. This method is used internally by `exportDataAsCsv`.
getDataAsExcel	(options?: GridExcelExportOptions) => Promise<Excel.Workbook> \| null	Returns the grid data as an exceljs workbook. This method is used internally by `exportDataAsExcel`.
getExpandedDetailPanels	() => GridRowId[]	Returns the rows whose detail panel is open.
getLocaleText	<T extends GridTranslationKeys>(key: T) => GridLocaleText[T]	Returns the translation for the `key`.
getPinnedColumns	() => GridPinnedColumns	Returns which columns are pinned.
getRootDimensions	() => GridDimensions \| null	Returns the dimensions of the grid
getRow	<R extends GridValidRowModel = any>(id: GridRowId) => R \| null	Gets the row data with a given id.
getRowElement	(id: GridRowId) => HTMLDivElement \| null	Gets the underlying DOM element for a row at the given `id`.
getRowGroupChildren	(params: GridRowGroupChildrenGetterParams) => GridRowId[]	Gets the rows of a grouping criteria. Only contains the rows provided to the grid, not the rows automatically generated by it.
getRowIdFromRowIndex	(index: number) => GridRowId	Gets the `GridRowId` of a row at a specific index. The index is based on the sorted but unfiltered row list.
getRowIndexRelativeToVisibleRows	(id: GridRowId) => number	Gets the index of a row relative to the rows that are reachable by scroll.
getRowMode	(id: GridRowId) => GridRowMode	Gets the mode of a row.
getRowModels	() => Map<GridRowId, GridRowModel>	Gets the full set of rows as Map<GridRowId, GridRowModel>.
getRowNode	<N extends GridTreeNode>(id: GridRowId) => N \| null	Gets the row node from the internal tree structure.
getRowParams	(id: GridRowId) => GridRowParams	Gets the GridRowParams object that is passed as argument in events.
getRowsCount	() => number	Gets the total number of rows in the grid.
getRowWithUpdatedValues	(id: GridRowId, field: string) => GridRowModel	Returns the row with the values that were set by editing the cells. In row editing, `field` is ignored and all fields are considered.
getScrollPosition	() => GridScrollParams	Returns the current scroll position.
getSelectedRows	() => Map<GridRowId, GridRowModel>	Returns an array of the selected rows.
getSortedRowIds	() => GridRowId[]	Returns all row ids sorted according to the active sort model.
getSortedRows	() => GridRowModel[]	Returns all rows sorted according to the active sort model.
getSortModel	() => GridSortModel	Returns the sort model currently applied to the grid.
getVisibleColumns	() => GridStateColDef[]	Returns the currently visible columns.
hideColumnMenu	() => void	Hides the column menu that is open.
hideFilterPanel	() => void	Hides the filter panel.
hideHeaderFilterMenu	() => void	Hides the header filter menu.
hidePreferences	() => void	Hides the preferences panel.
isCellEditable	(params: GridCellParams) => boolean	Controls if a cell is editable.
isColumnPinned	(field: string) => GridPinnedPosition \| false	Returns which side a column is pinned to.
isRowSelectable	(id: GridRowId) => boolean	Determines if a row can be selected or not.
isRowSelected	(id: GridRowId) => boolean	Determines if a row is selected or not.
pinColumn	(field: string, side: GridPinnedPosition) => void	Pins a column to the left or right side of the grid.
publishEvent	GridEventPublisher	Emits an event.
removeRowGroupingCriteria	(groupingCriteriaField: string) => void	Remove the field from the row grouping model.
resetRowHeights	() => void	Forces the recalculation of the heights of all rows.
resize	() => void	Triggers a resize of the component and recalculation of width and height.
restoreState	(stateToRestore: InitialState) => void	Inject the given values into the state of the DataGrid.
scroll	(params: Partial<GridScrollParams>) => void	Triggers the viewport to scroll to the given positions (in pixels).
scrollToIndexes	(params: Partial<GridCellIndexCoordinates>) => boolean	Triggers the viewport to scroll to the cell at indexes given by `params`. Returns `true` if the grid had to scroll to reach the target.
selectRow	(id: GridRowId, isSelected?: boolean, resetSelection?: boolean) => void	Change the selection state of a row.
selectRowRange	(range: { startId: GridRowId; endId: GridRowId }, isSelected?: boolean, resetSelection?: boolean) => void	Change the selection state of all the selectable rows in a range.
selectRows	(ids: GridRowId[], isSelected?: boolean, resetSelection?: boolean) => void	Change the selection state of multiple rows.
setAggregationModel	(model: GridAggregationModel) => void	Sets the aggregation model to the one given by `model`.
setCellFocus	(id: GridRowId, field: string) => void	Sets the focus to the cell at the given `id` and `field`.
setColumnHeaderFilterFocus	(field: string, event?: MuiBaseEvent) => void	Sets the focus to the column header filter at the given `field`.
setColumnHeaderFocus	(field: string, event?: MuiBaseEvent) => void	Sets the focus to the column header at the given `field`.
setColumnIndex	(field: string, targetIndexPosition: number) => void	Moves a column from its original position to the position given by `targetIndexPosition`.
setColumnVisibility	(field: string, isVisible: boolean) => void	Changes the visibility of the column referred by `field`.
setColumnVisibilityModel	(model: GridColumnVisibilityModel) => void	Sets the column visibility model to the one given by `model`.
setColumnWidth	(field: string, width: number) => void	Updates the width of a column.
setDensity	(density: GridDensity) => void	Sets the density of the grid.
setEditCellValue	(params: GridEditCellValueParams, event?: MuiBaseEvent) => Promise<boolean> \| void	Sets the value of the edit cell. Commonly used inside the edit cell component.
setExpandedDetailPanels	(ids: GridRowId[]) => void	Changes which rows to expand the detail panel.
setFilterLogicOperator	(operator: GridLogicOperator) => void	Changes the GridLogicOperator used to connect the filters.
setFilterModel	(model: GridFilterModel, reason?: GridControlledStateReasonLookup['filter']) => void	Sets the filter model to the one given by `model`.
setPage	(page: number) => void	Sets the displayed page to the value given by `page`.
setPageSize	(pageSize: number) => void	Sets the number of displayed rows to the value given by `pageSize`.
setPaginationModel	(model: GridPaginationModel) => void	Sets the `paginationModel` to a new value.
setPinnedColumns	(pinnedColumns: GridPinnedColumns) => void	Changes the pinned columns.
setQuickFilterValues	(values: any[]) => void	Set the quick filter values ot the one given by `values`
setRowChildrenExpansion	(id: GridRowId, isExpanded: boolean) => void	Expand or collapse a row children.
setRowGroupingCriteriaIndex	(groupingCriteriaField: string, groupingIndex: number) => void	Sets the grouping index of a grouping criteria.
setRowGroupingModel	(model: GridRowGroupingModel) => void	Sets the columns to use as grouping criteria.
setRowIndex	(rowId: GridRowId, targetIndex: number) => void	Moves a row from its original position to the position given by `targetIndex`.
setRows	(rows: GridRowModel[]) => void	Sets a new set of rows.
setRowSelectionModel	(rowIds: GridRowId[]) => void	Updates the selected rows to be those passed to the `rowIds` argument. Any row already selected will be unselected.
setSortModel	(model: GridSortModel) => void	Updates the sort model and triggers the sorting of rows.
showColumnMenu	(field: string) => void	Display the column menu under the `field` column.
showFilterPanel	(targetColumnField?: string, panelId?: string, labelId?: string) => void	Shows the filter panel. If `targetColumnField` is given, a filter for this field is also added.
showHeaderFilterMenu	(field: GridColDef['field']) => void	Opens the header filter menu for the given field.
showPreferences	(newValue: GridPreferencePanelsValue, panelId?: string, labelId?: string) => void	Displays the preferences panel. The `newValue` argument controls the content of the panel.
sortColumn	(column: GridColDef, direction?: GridSortDirection, allowMultipleSorting?: boolean) => void	Sorts a column.
startCellEditMode	(params: GridStartCellEditModeParams) => void	Puts the cell corresponding to the given row id and field into edit mode.
startHeaderFilterEditMode	(field: GridColDef['field']) => void	Puts the cell corresponding to the given row id and field into edit mode.
startRowEditMode	(params: GridStartRowEditModeParams) => void	Puts the row corresponding to the given id into edit mode.
state	State	Property that contains the whole state of the grid.
stopCellEditMode	(params: GridStopCellEditModeParams) => void	Puts the cell corresponding to the given row id and field into view mode and updates the original row with the new value stored. If `params.ignoreModifications` is `false` it will discard the modifications made.
stopHeaderFilterEditMode	() => void	Stops the edit mode for the current field.
stopRowEditMode	(params: GridStopRowEditModeParams) => void	Puts the row corresponding to the given id and into view mode and updates the original row with the new values stored. If `params.ignoreModifications` is `false` it will discard the modifications made.
subscribeEvent	<E extends GridEvents>(event: E, handler: GridEventListener<E>, options?: EventListenerOptions) => () => void	Registers a handler for an event.
toggleColumnMenu	(field: string) => void	Toggles the column menu under the `field` column.
toggleDetailPanel	(id: GridRowId) => void	Expands or collapses the detail panel of a row.
unpinColumn	(field: string) => void	Unpins a column.
unstable_getAllGroupDetails	() => GridColumnGroupLookup	Returns the column group lookup.
unstable_getCellSelectionModel	() => GridCellSelectionModel	Returns an object containing the selection state of the cells. The keys of the object correpond to the row IDs. The value of each key is another object whose keys are the fields and values are the selection state.
unstable_getColumnGroupPath	(field: string) => GridColumnGroup['groupId'][]	Returns the id of the groups leading to the requested column. The array is ordered by increasing depth (the last element is the direct parent of the column).
unstable_getSelectedCellsAsArray	() => GridCellCoordinates[]	Returns an array containing only the selected cells. Each item is an object with the ID and field of the cell.
unstable_isCellSelected	(id: GridRowId, field: GridColDef['field']) => boolean	Determines if a cell is selected or not.
unstable_replaceRows	(firstRowToReplace: number, newRows: GridRowModel[]) => void	Replace a set of rows with new rows.
unstable_selectCellRange	(start: GridCellCoordinates, end: GridCellCoordinates, keepOtherSelected?: boolean) => void	Selects all cells that are inside the range given by `start` and `end` coordinates.
unstable_setCellSelectionModel	(newModel: GridCellSelectionModel) => void	Updates the selected cells to be those passed to the `newModel` argument. Any cell already selected will be unselected.
unstable_setPinnedRows	(pinnedRows?: GridPinnedRowsProp) => void	Changes the pinned rows.
updateColumns	(cols: GridColDef[]) => void	Updates the definition of multiple columns at the same time.
updateRows	(updates: GridRowModelUpdate[]) => void	Allows to update, insert and delete rows.
upsertFilterItem	(item: GridFilterItem) => void	Updates or inserts a GridFilterItem.
upsertFilterItems	(items: GridFilterItem[]) => void	Updates or inserts many GridFilterItem.