dash
dash copied to clipboard
Dashtable tooltip_conditional filter cause exception when client side pagination is enabled
dash 2.17.1
dash-core-components 2.0.0
dash-html-components 2.0.0
dash-table 5.0.0
- OS: Ubuntu 22.04
- Browser: Chrome
- Version: 127.0.6533.119
Describe the bug
When client side pagination of dashtable is enabled, the tooltip_conditional filter will cause "TypeError: Can not read property of undefined" exception when try to navigate to next page. It is fine on the first page though.
A sample example to reproduce the problem.
from dash import html
from dash import dash_table
import pandas as pd
from collections import OrderedDict
import dash
app = dash.Dash(__name__)
df = pd.DataFrame(OrderedDict([
('climate', ['Sunny', 'Snowy', 'Sunny', 'Rainy']),
('temperature', [13, 43, 50, 30]),
('city', ['NYC', 'Montreal', 'Miami', 'NYC'])
]))
app.layout = html.Div([
dash_table.DataTable(
id='table',
data=df.to_dict('records'),
columns=[
{'id': 'climate', 'name': 'climate'},
{'id': 'temperature', 'name': 'temperature'},
{'id': 'city', 'name': 'city'},
],
page_size=3,
tooltip_conditional=[
{
'if': {
'filter_query': '{climate} = "Sunny"',
},
'value': 'it is sunny'
}
]
),
html.Div(id='table-dropdown-container')
])
if __name__ == '__main__':
app.run_server(debug=True, dev_tools_hot_reload=False, port=8051)
Run the program, navigate to the second page of the table and hover mouse over a row, you will see the error prompt by developer tool.
I have raised the same issue when dash-table was in its own repo and suggested some PR. Please find that issue here https://github.com/plotly/dash-table/issues/917