Text filters allow you to filter string data.
The Provided Filters and Simple Filters pages explain the parts of the Text Filter that are the same as the other Provided Filters. This page builds on that and explains some details that are specific to the Text Filter.
Text Filters are configured though the filterParams attribute of the column definition (ITextFilterParams interface):
alwaysShowBothConditions
(boolean) By default, only one condition is shown, and a second is made visible once a first condition has been entered. Set this to true to always show both conditions. In this case the second condition will be disabled until a first condition has been entered. Default: Falsebuttons
Specifies the buttons to be shown in the filter, in the order they should be displayed in. The options are:caseSensitive
(boolean) By default, text filtering is case-insensitive. Set this to true to make text filtering case-sensitive. Default: falsecloseOnApply
(boolean) If the Apply button is present, the filter popup will be closed immediately when the Apply or Reset button is clicked if this is set to true. Default: falsedebounceMs
(number) Overrides the default debounce time in milliseconds for the filter. Defaults are:defaultJoinOperator
By default, the two conditions are combined using AND. You can change this default by setting this property. Options: AND, ORdefaultOption
(string) The default filter option to be selected.filterOptions
Array of filter options to present to the user. See Filter Options.filterPlaceholder
Placeholder text for the filter textboxsuppressAndOrCondition
(boolean) If true, the filter will only allow one condition. Default: falsetextFormatter
(Function) Formats the text before applying the filter compare logic. Useful if you want to substitute accented characters, for example.textMatcher
(Function) Used to override how to filter based on the user input.trimInput
(boolean) If true, the input that the user enters will be trimmed when the filter is applied, so any leading or trailing whitespace will be removed. If only whitespace is entered, it will be left as-is. If you enable trimInput, it is best to also increase the debounceMs to give users more time to enter text. Default: falseBy default the text filter performs strict case-insensitive text filtering, i.e. if you provide \['1,234.5USD','345GBP'\]
as data for a text column:
You can change the default behaviour by providing your own textMatcher
, which allows you to provide your own logic to decide when to include a row in the filtered results.
By default, the grid compares the text filter with the values in a case-insensitive way, by converting both the filter text and the values to lower-case and comparing them; for example, ‘o’ will match ‘Olivia’ and ‘Salmon’. If you instead want to have case-sensitive matches, you can set caseSensitive = True
in the filterParams
, so that no lower-casing is performed. In this case, ‘o’ would no longer match ‘Olivia’.
filterOptions = ['contains', 'notContains']
debounceMs = 200
).suppressAndOrCondition = True
)filterOptions = ['contains']
trimInput = True
)debounceMs = 1000
)defaultOption = 'startsWith'
)caseSensitive = True
)Note: See the Column Filters Overview section for more filter options
import dash_ag_grid as dag
from dash import Dash, html
import pandas as pd
app = Dash(__name__)
df = pd.read_csv(
"https://raw.githubusercontent.com/plotly/datasets/master/ag-grid/olympic-winners.csv"
)
athleteFilterParams = {
"filterOptions": ["contains", "notContains"],
"debounceMs": 200,
"suppressAndOrCondition": True,
}
countryFilterParams = {
"filterOptions": ["contains"],
"trimInput": True,
"debounceMs": 1000,
}
columnDefs = [
{
"field": "athlete",
"filterParams": athleteFilterParams,
},
{
"field": "country",
"filter": "agTextColumnFilter",
"filterParams": countryFilterParams,
},
{
"field": "sport",
"filter": "agTextColumnFilter",
"filterParams": {
"caseSensitive": True,
"defaultOption": "startsWith",
},
},
]
defaultColDef = {
"flex": 1,
"sortable": True,
"filter": True,
}
app.layout = html.Div(
[
dag.AgGrid(
id="text-filter-example",
rowData=df.to_dict("records"),
columnDefs=columnDefs,
columnSize="sizeToFit",
defaultColDef=defaultColDef,
),
]
)
if __name__ == "__main__":
app.run(debug=True)