✊🏿 Black Lives Matter. Please consider donating to Black Girls Code today.
⚡️ Concerned about the grid? Kyle Baranko teaches how to predicting peak loads using XGBoost. Register for the August webinar!

Any target for Output returns a Key_Error

After many tries, i can’t figure out why, but any target for this callback’s output will return a key_error.

Layout :

...
app = DjangoDash('liste_app',  serve_locally=True)
app.layout = ...
...
...
html.Div(className='card-body',
            children=[
                 dcc.Store(id='sorted_storage', data=''),
                 html.P(children=['filler text'],
                        id="sorted_liste", style={'overflow': 'scroll',
                                                  'height': '100px'})
                 ])
...

Callback

@app.expanded_callback(
    [Output('sorted_storage', 'data')],
    [Input('insert', 'n_clicks')],
    [State('tabs', 'value')]
    )
def insertSortButton(n_clicks, value, **context):
    if n_clicks is not None:
        liste = get_int_liste(context['request'].session.session_key, int(value))
        sorted_liste, time = insertSort(liste)
        save_algo_result(sorted_liste, time, context['request'].session.session_key, int(value), 'insert')e
    else:
        sorted_liste = 0
    return sorted_liste

Error :

File "D:\Projets\Python\Exercices\Algorithmique\venv\lib\site-packages\django_plotly_dash\dash_wrapper.py", line 620, in dispatch_with_args
    for component_registration in self.callback_map[target_id]['inputs']:
KeyError: 'sorted_storage.data'

0

I finally found out what I did wrong : If there is only one Outpput, it must not be in a list.

This is my code, returning key_error :

@app.expanded_callback(
[Output('sorted_storage', 'data')],
[Input('insert', 'n_clicks')],
[State('tabs', 'value')]
)

This is correct code working fine :

@app.expanded_callback(
Output('sorted_storage', 'data'),
[Input('insert', 'n_clicks')],
[State('tabs', 'value')]
)

The missleading part for me was that Inputs and States work the opposite way :

@app.expanded_callback(
[Output('sorted_storage', 'data')],
Input('insert', 'n_clicks'),
[State('tabs', 'value')]
)

@app.expanded_callback(
[Output('sorted_storage', 'data')],
[Input('insert', 'n_clicks')],
State('tabs', 'value')
)

Those 2 blocks of code return the error “‘Input’ Object is not iterable”/"‘State’ object is not iterable".

Hope it can help someone someday