Dash Pages - Duplicate Callbacks and Lazy Loading

Hi.

I’m using Dash Pages to build a multi-page app. I have two pages in that app that have similar controls, i.e. both have a DatePicker at the top to select an initial input. My hope was that I’d be able to develop these pages independently, but it seems that since the ID’s of that control are the same across both pages, I get a Duplicate Callback Outputs in the Debug view.

Any idea what I’m doing wrong?

This is what the Callback looks like:

Add a callback to dynamically update the max_date_allowed and initial_visible_month properties of the DatePicker

@callback(
[Output(‘date-picker’, ‘max_date_allowed’),
Output(‘date-picker’, ‘initial_visible_month’)],
[Input(‘date-picker’, ‘date’)]
)
def update_date_picker(_):
today = datetime.today()
return today, today

Additionally, in general how does this work? Are the pages lazy-loaded on request or does the entire app load at once on startup/first-load?

Hi @rkarim and welcome to the dash community! :slight_smile:

It is possible to use the same component with the same id on different pages. In example #13 in this repo, it’s used to sync components on different pages:

Could you make a minimal example that replicates the issue? Can’t tell what’s wrong based on the code you posted.

1 Like