GridApi Interface
The full grid API.
Import
import { GridApi } from '@mui/x-data-grid-pro';
Properties
| Name | Type | Description |
|---|---|---|
| applyFilter | (item: GridFilterItem, linkOperator?: GridLinkOperator) => void | Applies a GridFilterItem on alls rows. If no linkOperator is given, the "and" operator is used. |
| applyFilterLinkOperator | (operator: GridLinkOperator) => void | Changes the GridLinkOperator used to connect the filters. |
| applyFilters | () => void | Applies all filters on all rows. |
| applySorting | () => void | Applies the current sort model to the rows. |
| commitCellChange | (params: GridCommitCellChangeParams, event?: any) => boolean | Updates the field at the given id with the value stored in the edit row model. |
| commitRowChange | (id: GridRowId, event?: any) => boolean | Updates the row at the given id with the values stored in the edit row model. |
| components | GridApiRefComponentsProperty | The set of overridable components used in the grid. |
| componentsProps? | GridSlotsComponentsProps | Overrideable components props dynamically passed to the component at rendering. |
| deleteFilter | (item: GridFilterItem) => void | Deletes a GridFilterItem. |
| exportDataAsCsv | (options?: GridExportCsvOptions) => void | Downloads and exports a CSV of the grid's data. |
| forceUpdate | Dispatch<any> | 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) => null | HTMLDivElement | 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 | (id: GridRowId, field: string) => GridCellParams | Gets the GridCellParams object that is passed as argument in events. |
| getCellValue | (id: GridRowId, field: string) => GridCellValue | 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) => null | HTMLDivElement | 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. |
| getColumnPosition | (field: string) => number | Returns the left-position of a column relative to the inner border of the grid. |
| getColumnsMeta | () => GridColumnsMeta | Returns the GridColumnsMeta for each column. |
| getDataAsCsv | (options?: GridExportCsvOptions) => string | Returns the grid data as a CSV string. This method is used internally by exportDataAsCsv. |
| getEditRowsModel | () => GridEditRowsModel | Gets the edit rows model of the grid. |
| getLocaleText | <T extends keyof GridLocaleText>(key: T) => GridLocaleText[T] | Returns the translation for the key. |
| getRow | (id: GridRowId) => null | GridRowData | Gets the row data with a given id. |
| getRowElement | (id: GridRowId) => null | HTMLDivElement | Gets the underlying DOM element for a row at the given id. |
| getRowIdFromRowIndex | (index: number) => GridRowId | Gets the GridRowId of a row at a specific index. |
| getRowIndex | (id: GridRowId) => number | Gets the row index of a row with a given id. |
| getRowMode | (id: GridRowId) => GridRowMode | Gets the mode of a row. |
| getRowModels | () => Map<GridRowId, GridRowData> | Gets the full set of rows as Map<GridRowId, GridRowModel>. |
| 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. |
| getScrollPosition | () => GridScrollParams | Returns the current scroll position. |
| getSelectedRows | () => Map<GridRowId, GridRowData> | Returns an array of the selected rows. |
| getSortedRowIds | () => GridRowId[] | Returns all row ids sorted according to the active sort model. |
| getSortedRows | () => GridRowData[] | 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. |
| getVisibleRowModels | () => Map<GridRowId, GridRowData> | Returns a sorted Map containing only the visible rows. |
| hideColumnMenu | () => void | Hides the column menu that is open. |
| hideFilterPanel | () => void | Hides the filter panel. |
| hidePreferences | () => void | Hides the preferences panel. |
| isCellEditable | (params: GridCellParams) => boolean | Controls if a cell is editable. |
| publishEvent | (name: string, params?: any, event?: MuiEvent<MouseEvent | UIEvent | Event | SyntheticEvent<Element, Event> | KeyboardEvent | ClipboardEvent | ProgressEvent<EventTarget> | ErrorEvent | AnimationEvent | InputEvent | FocusEvent | CompositionEvent | DragEvent | PointerEvent | SecurityPolicyViolationEvent | TouchEvent | TransitionEvent | WheelEvent>) => void | Emits an event. |
| resize | () => void | Triggers a resize of the component and recalculation of width and height. |
| 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, allowMultiple?: boolean) => void | Change the selection state of a row. |
| selectRows | (ids: GridRowId[], isSelected?: boolean, deselectOtherRows?: boolean) => void | Change the selection state of multiple rows. |
| setCellFocus | (id: GridRowId, field: string) => void | Sets the focus to the cell at the given id and field. |
| setCellMode | (id: GridRowId, field: string, mode: GridCellMode) => void | Sets the mode of a cell. |
| setColumnHeaderFocus | (field: string, event?: SyntheticEvent<Element, Event>) => 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. |
| setColumnWidth | (field: string, width: number) => void | Updates the width of a column. |
| setDensity | (size: GridDensity, headerHeight?: number, rowHeight?: number) => void | Sets the density of the grid. |
| setEditCellValue | (params: GridEditCellValueParams, event?: SyntheticEvent<Element, Event>) => void | Sets the value of the edit cell. Commonly used inside the edit cell component. |
| setEditRowsModel | (model: GridEditRowsModel) => void | Set sthe edit rows model of the grid. |
| setFilterModel | (model: GridFilterModel) => 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. |
| setRowMode | (id: GridRowId, mode: GridRowMode) => void | Sets the mode of a row. |
| setRows | (rows: GridRowData[]) => void | Sets a new set of rows. |
| setSelectionModel | (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. |
| setState | (state: GridState | ((previousState: GridState) => GridState)) => void | Sets the whole state of the grid. |
| showColumnMenu | (field: string) => void | Display the column menu under the field column. |
| showError | (props: any) => void | Displays the error overlay component. |
| showFilterPanel | (targetColumnField?: string) => void | Shows the filter panel. If targetColumnField is given, a filter for this field is also added. |
| showPreferences | (newValue: GridPreferencePanelsValue) => 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. |
| state | GridState | Property that contains the whole state of the grid. |
| subscribeEvent | (event: string, handler: (params: any, event: MuiEvent< | MouseEvent | UIEvent | Event | SyntheticEvent<Element, Event> | KeyboardEvent | ClipboardEvent | ProgressEvent<EventTarget> | ErrorEvent | AnimationEvent | InputEvent | FocusEvent | CompositionEvent | DragEvent | PointerEvent | SecurityPolicyViolationEvent | TouchEvent | TransitionEvent | WheelEvent>, details: any) => void, options?: GridSubscribeEventOptions) => () => void | Registers a handler for an event. |
| toggleColumnMenu | (field: string) => void | Toggles the column menu under the field column. |
| updateColumn | (col: GridColDef) => void | Updates the definition of a column. |
| updateColumns | (cols: GridColDef[]) => void | Updates the definition of multiple columns at the same time. |
| updateRows | (updates: GridRowModelUpdate<>[]) => void | Allows to updates, insert and delete rows in a single call. |
| upsertFilter | (item: GridFilterItem) => void | Updates or inserts a GridFilterItem. |