Search code examples
pythonpandasplotlyplotly-dashplotly-python

Case insensitive search in dash data table column


I am not able to find any documentation/reference which helps me in putting the case insensitive search for a column in Dash DataTable. For filtering correctly, one should know the case before which becomes a tedious task.

from dash.dependencies import Input, Output
import datetime

import pandas as pd


df = pd.read_csv('https://raw.githubusercontent.com/plotly/datasets/master/gapminder2007.csv')
df = df[['continent', 'country', 'pop', 'lifeExp']]  # prune columns for example
df['Mock Date'] = [
    datetime.datetime(2020, 1, 1, 0, 0, 0) + i * datetime.timedelta(hours=13)
    for i in range(len(df))
]

app = Dash(__name__)

app.layout = dash_table.DataTable(
    columns=[
        {'name': 'Continent', 'id': 'continent', 'type': 'numeric'},
        {'name': 'Country', 'id': 'country', 'type': 'text'},
        {'name': 'Population', 'id': 'pop', 'type': 'numeric'},
        {'name': 'Life Expectancy', 'id': 'lifeExp', 'type': 'numeric'},
        {'name': 'Mock Dates', 'id': 'Mock Date', 'type': 'datetime'}
    ],
    data=df.to_dict('records'),
    filter_action='native',

    style_table={
        'height': 400,
    },
    style_data={
        'width': '150px', 'minWidth': '150px', 'maxWidth': '150px',
        'overflow': 'hidden',
        'textOverflow': 'ellipsis',
    }
)


if __name__ == '__main__':
    app.run_server(debug=True)```

Solution

  • From the docs:

    filter_action is an a value equal to: 'custom', 'native' or 'none' | dict with keys:
    
     - operator (a value equal to: 'and' or 'or'; optional)
    
     - type (a value equal to: 'custom' or 'native'; required)
    
    filter_options (dict; optional): There are two filter_options props in the table. This is the table-level filter_options prop and there is also the column-level filter_options prop. These props determine whether the applicable filter relational operators will default to sensitive or insensitive comparison. If the column-level filter_options prop is set it overrides the table-level filter_options prop for that column.
    
    filter_options is a dict with keys:
    
     - case (a value equal to: 'sensitive' or 'insensitive'; optional)