Skip to contentSkip to content

GridToolbarQuickFilter API

API reference docs for the React GridToolbarQuickFilter component. Learn about the props, CSS, and other APIs of this exported module.

Demos

Import

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

Learn about the difference by reading this guide on minimizing bundle size.

Props

The debounce time in milliseconds.

Type:number

Default:150

Function responsible for formatting values of quick filter in a string when the model is modified

Type:func

Default:(values: string[]) => values.join(' ')

Signature:
function(values: Array) => string
  • values The new values passed to the quick filter model

Function responsible for parsing text input in an array of independent values for quick filtering.

Type:func

Default:(searchText: string) => searchText .split(' ') .filter((word) => word !== '')

Signature:
function(input: string) => Array
  • input The value entered by the user
The ref is forwarded to the root element.

Source code

If you did not find the information in this page, consider having a look at the implementation of the component for more detail.