Nested Callbacks

Dash Python
1

Hello Everyone! I have a multipage dash app which has the following structure:

  • app.py
    • Pages
      • multivariate-analysis.py
      • Charts (Folder)
        • bar-chart.py

Now I wanted to ask that I have a dropdown with chart options and html.Div(id=‘main-div’) in multivariate-analysis.py. The callback of this file on the basis of value selected from the dropdown updates the html.Div(id=‘main-div’) element. It is currently calling the layout function from the bar-chart.py file in Charts folder. In the bar-chart.py, there is a button to add dropdowns dynamically and a html.Div(id=‘dropdown-container’) element to show the dropdowns added in that element which is actually updating the html.Div(id=‘main-div’) in multivariate-analysis.py file. The issue I am facing is that on running the page of multivariate-analysis I am getting this error in my console:
“In the callback for output(s):
dynamic-dropdowns.children@8b966a484d8e6a0f52e765755da540f7
Output 0 (dynamic-dropdowns.children@8b966a484d8e6a0f52e765755da540f7) is already in use.
To resolve this, set allow_duplicate=True on
duplicate outputs, or combine the outputs into
one callback function, distinguishing the trigger
by using dash.callback_context if necessary.”

I am guessing that it is due to me calling a callback of a separate page inside callback of another page. If someone has any idea how to tackle this I will be thankful to them. And for those who might be confused as to why I am doing it like this. I wanted a folder to have pages of multiple charts each chart has its own configurations (x, y axis values) and complexity and I wanted to tackle it thru this approach. If there is a better approach feel free to correct me.

2

Hello @ghulam_shabbir_khan,

This is because you are adding the callback to the page, at least it looks this way.

You can do as it suggests and allow_duplicate=True.

In the end, callbacks are just functions and you can call them and intercept their response as you need to.

This may be easier if you place your callbacks into a single file, in a utils folder or something.

3

@jinnyzor I tried the suggestion with allow_duplicate=True, but it doesn’t seem to work and still throws me the same error.

4

Ah, this is because of a glitch with Dash, it serializes the inputs to determine whether a callback is unique… since you have the exact same inputs it reads them as the same…

Seems like you should just be calling the function directly instead of registering it on that other page.

5

Yeah, I think that’s the only sol at this point. I wanted to optimize the main file so that the code would be minimal, and optimized and only the selected code would be executed since I have multiple charts and in the future maybe more. :frowning: