Dash Callback Input and Output sharing the same component ID

Dash Python
1

Here is the scenario I have,

  1. Two dropdowns(Input) filtering DashTable as Output
  2. Selecting DashTable Row (Input) to create a bar chart → fails

Property ID was used with component ID… in one of the Input items of a callback.
This ID is assigned to a dash.DataTable component in the layout, which does not support this property.
This ID was used in the callback for Output…

2

@stef007

See if you can use State instead Input.

1 Like
3

@stef007 yeah use State just as @Eduardo said. I was also changing multiple attributes like this,


@app.callback(
Output('time-slider','marks'),
Output('time-slider','max'),
[Input('update-graph', 'n_clicks')],
[State('time-slider', 'value')],
[State('dropdown-date', 'value')]
)
def updategraph(n_clicks,selectedtime):
     marks = {..} 
     max = 100
     return marks,max
1 Like
4

well, I tried and that did not work for me… please allow me to explain:

first callback, the Output is filtered dash.DataTable

@app.callback(
    Output('partner-datatable', 'data'),
    [Input('crossfilter-teams', 'value'),
     Input('crossfilter-months', 'value')])

The other the Input is from that dash.DataTable, and the Output should be a chart corresponding to selected row

@app.callback(
    Output('partner-chart', 'figure'),
    Input('partner-datatable', 'selected_row_id'),
    Input('partner-datatable', 'active_cell'))

and that does not work

5

@stef007

Here is not the issue, you are not shearing the same id, check if the problem is in an other part of the code.

6

Thank you for being so patient with me. However, when I do omit that last callback all is working well and I do not receive this error message:

Property “selected_row_id” was used with component ID:
“partner-datatable”
in one of the Input items of a callback.
This ID is assigned to a dash_table.DataTable component
in the layout, which does not support this property.
This ID was used in the callback(s) for Output(s):
partner-chart.figure

7

Hi @stef007

The correct name for the prop is: selected_row_ids (plural :slight_smile: )

Try:

Input('partner-datatable', 'selected_row_ids'),
1 Like
8

Thank you so much, good catch. very much appreciated

1 Like