✊🏿 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!

A nonexistent object was used in an `Input` of a Dash callback an multipage app

Hello,
I have the following code, on the old man there is a panel that changes the set of functions (buttons) depending on an external factor, at the moment I encountered the following error,
please, tell me how you can solve it
error: A nonexistent object was used in an Input of a Dash callback.

### Here switch betwen s and m groupby panel
@app.callback(Output('control-panel', 'children'),
              Input('switch_s_m', 'value'),
              )
def panel_groupby(m_s):
    if m_s == 'm':
        return html.Div([
            html.Label('Detalied', className="active", id="list"),
            html.Label('Group by Date', id="group_date"),
            html.Label('Group by G', id="group_g")
        ], className="groupby")
    elif m_s == 's':
        return html.Div([
            html.Label('Detalied', className="active", id="list"),
            html.Label('Group by Date', id="group_date"),
            html.Label('Group by Network', id="group_net"),
            html.Label('Group by Country', id='group_country'),
            html.Label('Group by G', id='group_g')
        ], className="groupby")


@app.callback(Output('table', 'children'),
              [Input('list', 'n_clicks'),
               Input('group_date', 'n_clicks'),
               Input('group_g', 'n_clicks'),
               Input('from_date', 'date'),
               Input('end_date', 'date'),
               Input('url', 'pathname'),
               Input('switch_sms_msu', 'value'),
               Input('group_net', 'n_clicks'),
               Input('group_country', 'n_clicks')]
               )
def table_detalied(n_all, n_date, n_gt, start_d, end_d, pathname, type, net, contr):

two control panels have a common set of functions and the second two additional
it general:

[Input('list', 'n_clicks'),
 Input('group_date', 'n_clicks'),
 Input('group_g', 'n_clicks'),

and addition on of the second

Input('group_net', 'n_clicks'),
Input('group_country', 'n_clicks')]

Hi @dilfin07

I think the problem you have is that you are defining some ids in a callback:

def panel_groupby(m_s):
    if m_s == 'm':
        return html.Div([
            html.Label('Detalied', className="active", id="list"),
            html.Label('Group by Date', id="group_date"),
            html.Label('Group by GT', id="group_g")
        ], className="groupby")
    elif m_s == 's':
        return html.Div([
            html.Label('Detalied', className="active", id="list"),
            html.Label('Group by Date', id="group_date"),
            html.Label('Group by Network', id="group_net"),
            html.Label('Group by Country', id='group_country'),
            html.Label('Group by G', id='group_g')
        ], className="groupby")

And when the other callback try to use those inputs from the layout, those ids do not exist jet.

You need to have all the ids defined in the leayout at the beginning or use alternatives to do not trigger the callback until those ids are in the layout using prevent update or other tools.

Hello @Eduardo

app.config[‘suppress_callback_exceptions’] = True
can this help in this case? or can you give a short example?
Thank you

Hi @dilfin07

See different posibilities in this tutorial from @AnnMarieW:
https://hellodash.pythonanywhere.com/cheatsheet

Go to section " App Quickstart" and see the item: "Advanced Callback Cheatsheet"

There you will find the different tools you have to prevent callbacks triggered.

Hello @Eduardo
I tried using the cheat sheets, but unfortunately I don’t get the desired result,
when i switch to panel ‘m’
I get an error:
A nonexistent object was used in an Input of a Dash callback. The id of this object is group_net and the property is n_clicks. The string ids in the current layout are: [switch_s_m, url, from_date, end_date, download-csv, control-panel, table, file_csv, list, group_date, group_gt]

Hey @dilfin07

In your callback the Output is control-panel children. And if you select “m” the children change to the new html.Div that do not have the html.Label(‘Group by Network’, id=“group_net”).

Then when the other callbacks try to use it:

Input('group_net', 'n_clicks'),

It doesn’t find, because you had replace by the new html.Div.

Hi @Eduardo

So, I followed these steps, it allowed to use both panels as intended without errors

            html.Label('Group by Network', id={"type": "group_net", "index": "myindex"}),
            html.Label('Group by Country', id={"type": 'group_country', "index": "myindex"}),
.......................
               Input({"type": "group_net", "index": ALL}, 'n_clicks'),
               Input({"type": 'group_country', "index": ALL}, 'n_clicks'),
1 Like

Yeah it works! Thanks.