# Nested Callbacks

**URL:** <https://community.plotly.com/t/nested-callbacks/79415>\
**Category:** Dash Python\
**Tags:** question\
**Created:** [October 18, 2023, 7:14am UTC](https://community.plotly.com/t/nested-callbacks/79415 "2023-10-18T07:14:07Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![ghulam\_shabbir\_khan](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/ghulam_shabbir_khan/32/26276_2.png) [@ghulam\_shabbir\_khan](https://community.plotly.com/u/ghulam_shabbir_khan)\
**Post date:** [October 18, 2023, 7:14am UTC](https://community.plotly.com/t/nested-callbacks/79415/1 "2023-10-18T07:14:07Z")

</div>

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.

---

<div class="post-metadata">

**Author:** ![jinnyzor](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/jinnyzor/32/21194_2.png) [@jinnyzor](https://community.plotly.com/u/jinnyzor)\
**Post date:** [October 18, 2023, 9:06am UTC](https://community.plotly.com/t/nested-callbacks/79415/2 "2023-10-18T09:06:44Z")

</div>

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.

---

<div class="post-metadata">

**Author:** ![ghulam\_shabbir\_khan](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/ghulam_shabbir_khan/32/26276_2.png) [@ghulam\_shabbir\_khan](https://community.plotly.com/u/ghulam_shabbir_khan)\
**Post date:** [October 18, 2023, 9:17am UTC](https://community.plotly.com/t/nested-callbacks/79415/3 "2023-10-18T09:17:39Z")

</div>

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

---

<div class="post-metadata">

**Author:** ![jinnyzor](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/jinnyzor/32/21194_2.png) [@jinnyzor](https://community.plotly.com/u/jinnyzor)\
**Post date:** [October 18, 2023, 9:20am UTC](https://community.plotly.com/t/nested-callbacks/79415/4 "2023-10-18T09:20:43Z")

</div>

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.

---

<div class="post-metadata">

**Author:** ![ghulam\_shabbir\_khan](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/ghulam_shabbir_khan/32/26276_2.png) [@ghulam\_shabbir\_khan](https://community.plotly.com/u/ghulam_shabbir_khan)\
**Post date:** [October 18, 2023, 9:41am UTC](https://community.plotly.com/t/nested-callbacks/79415/5 "2023-10-18T09:41:41Z")

</div>

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. ☹
