# dcc.Location - inconsistency when trying to navigate from one page to another in multipage app

**URL:** <https://community.plotly.com/t/dcc-location-inconsistency-when-trying-to-navigate-from-one-page-to-another-in-multipage-app/85515>\
**Category:** Dash Python\
**Created:** [July 2, 2024, 1:56pm UTC](https://community.plotly.com/t/dcc-location-inconsistency-when-trying-to-navigate-from-one-page-to-another-in-multipage-app/85515 "2024-07-02T13:56:09Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Priyanka\_Subramani](https://avatars.discourse-cdn.com/v4/letter/p/2bfe46/32.png) [@Priyanka\_Subramani](https://community.plotly.com/u/Priyanka_Subramani)\
**Post date:** [July 2, 2024, 1:56pm UTC](https://community.plotly.com/t/dcc-location-inconsistency-when-trying-to-navigate-from-one-page-to-another-in-multipage-app/85515/1 "2024-07-02T13:56:09Z")

</div>

I have a multi page app

dash - 2.17.1  
dcc - 2.14.1  
html - 2.0.18  
dash\_table - 5.2.11  
Windows OS  
Browser - Edge

I have a multi-page Dash app with a home page and a detail page (using the path template /detail/:id. On the home page, there’s a dropdown for selecting IDs. When an ID is selected, it should redirect to /detail/:selected id using dcc.Location. This is done through a callback on the homepage.

data is a df with name and id columns

```auto
> layout = dbc.Container([
> dbc.Row([
> dbc.Col([
> html.H6("Analysis", className="app-subtitle text-center"),
> dcc.Dropdown(
> id="dropdown-results",
> options=[],
> placeholder="Search by Name or ID",
> multi=False,
> value=None
> ),
> dcc.Location(id='url', refresh=True),
> ], width=8),
> ], justify='center', align='center'),
> ], fluid=True)
> 
> @callback(
> Output("dropdown-results", "options"),
> Input("dropdown-results", "search_value")
> )
> def update_dropdown(search_value):
> if not search_value:
> return []
> filtered_df = data[
> (data['name'].str.contains(search_value, case=False, na=False)) |
> (data[id'].astype(str).str.contains(search_value, case=False, na=False))
> ]
> 
> if filtered_df.empty:
> return []
> 
> # Format the dropdown options
> options = [
> {'label': f"{row['name']} - {row['name']} (ID: {row['id']})", 'value': row['id']}
> for index, row in data.iterrows()
> ]
> 
> return options
> 
> @callback(Output('url', 'pathname'),
> [Input('dropdown-results', 'value')])
> def display_page(selected_value):
> if selected_value:
> str_id= str(selected_value)
> print(str_id)
> return f"/detail/{str_id}"

```

The issue is that sometimes the URL changes as expected, but other times it doesn’t, showing inconsistency. Although I can see that str\_id is printed always, the URL isn’t always updated or redirected to the new page.

Do you have any pointers on how to debug this inconsistency?

Thanks!

---

<div class="post-metadata">

**Author:** ![adamschroeder](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/adamschroeder/32/17280_2.png) [@adamschroeder](https://community.plotly.com/u/adamschroeder)\
**Post date:** [July 2, 2024, 3:29pm UTC](https://community.plotly.com/t/dcc-location-inconsistency-when-trying-to-navigate-from-one-page-to-another-in-multipage-app/85515/2 "2024-07-02T15:29:35Z")

</div>

Thank you for the question, @Priyanka_Subramani .

@AnnMarieW has several good examples of multipage Dash apps. Maybe those can help.

Regarding your question, are you able to share a minimal reproducible example with us so that we can run it locally and reproduce the error you’re getting?

---

<div class="post-metadata">

**Author:** ![Priyanka\_Subramani](https://avatars.discourse-cdn.com/v4/letter/p/2bfe46/32.png) [@Priyanka\_Subramani](https://community.plotly.com/u/Priyanka_Subramani)\
**Post date:** [July 3, 2024, 9:03am UTC](https://community.plotly.com/t/dcc-location-inconsistency-when-trying-to-navigate-from-one-page-to-another-in-multipage-app/85515/3 "2024-07-03T09:03:18Z")

</div>

Thank you for pointing to the examples: I got a very good idea from [dash-multi-page-app-demos/multi\_page\_update\_url\_in\_callback\_V292/pages/home.py at main · AnnMarieW/dash-multi-page-app-demos · GitHub](https://github.com/AnnMarieW/dash-multi-page-app-demos/blob/main/multi_page_update_url_in_callback_V292/pages/home.py) and fixed my issue(issue was we needed to keep dcc.Location in the main app.py instead of pages and use callback-nav as refresh! for it to work consistently )

But may be a suggestion, if we can add an example with dropdown value selection redirecting to another page in the above repo, it would be great!

Thanks!