plotly / dash-table

OBSOLETE: now part of https://github.com/plotly/dash
https://dash.plotly.com
MIT License
420 stars 74 forks source link

Can not read properties of undefined 'X' #950

Open croll12-creator opened 1 year ago

croll12-creator commented 1 year ago

Using virtualization=True and style_data_conditional throws an error of 'can not read properties of undefined column_name'. Here is an MWE to test with, scroll down a bit on the table and then select a cell in the last column. I created a topic on the community forum and the results were it seems to be a bug. Community Topic

import dash
import dash_table
import dash_html_components as html
from dash.dependencies import Input, Output, State, MATCH, ALL
import pandas as pd

app = dash.Dash(__name__)

df = pd.read_csv('https://raw.githubusercontent.com/plotly/datasets/master/Emissions%20Data.csv').reset_index()
df['Emission'] = df['Emission'].map(lambda x: '{0:.2f}'.format(x))

app.layout = html.Div([html.Div([], id='test'), dash_table.DataTable(
    id='table',
        data=df.to_dict('records'),
        columns=[{'id': c, 'name': c} for c in df.columns],
        editable=True,
        filter_action="native",
        sort_action="native",
        sort_mode="multi",
        page_action="none",
        fixed_rows={'headers': True, 'data': 0},
        #sort_action='native',
        export_format="xlsx",
        export_headers="display",
        export_columns='all',
        #filter_action='native',        
        virtualization=True,
        style_data_conditional=[{
                    'if': {
                        'filter_query': '{Emission} > 0',
                        'column_id': 'Emission'
                    },
                    'color': 'green'
                },
                {
                    'if': {
                        'filter_query': '{Emission} < 0',
                        'column_id': 'Emission'
                    },
                    'color': 'red'
                }],
        tooltip_conditional=[
            {
                'if': {
                    'filter_query': '{Emission} < 0',
                        'column_id': 'Emission'
                        },
                'value': 'Further review required, calculated demand is 20% lower than the 3 year average units sold'
            },
            {
                'if': {
                    'filter_query': '{Emission} > 0',
                        'column_id': 'Emission'
                        },
                'value': 'Further review required, calculated demand is 20% higher than the 3 year average units sold'
            },
        ]
)
])

@app.callback(Output('test', 'children'), [Input('table', 'active_cell')])
def updateIT(ac):
    if ac:
        return ac['column_id']
    else:
        return ''

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