# How to refresh page after upload

**URL:** <https://community.plotly.com/t/how-to-refresh-page-after-upload/64286>\
**Category:** Dash Python\
**Created:** [May 19, 2022, 7:36pm UTC](https://community.plotly.com/t/how-to-refresh-page-after-upload/64286 "2022-05-19T19:36:12Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![Brent](https://avatars.discourse-cdn.com/v4/letter/b/ec9cab/32.png) [@Brent](https://community.plotly.com/u/Brent)\
**Post date:** [May 19, 2022, 7:36pm UTC](https://community.plotly.com/t/how-to-refresh-page-after-upload/64286/1 "2022-05-19T19:36:12Z")

</div>

I have an upload button that uploads a file. It works fine.

dbc.Col(dcc.Upload(html.Button(‘Upload CTM’),  
id=‘hist-upload’), width={‘size’: 2})]),

I have a callback that is triggered on the file contents and file name.

I want to have the page refresh after the upload so I tried this:

dbc.Col(html.A(dcc.Upload(html.Button(‘Upload CTM’),  
id=‘hist-upload’),  
href=’/history-version’), width={‘size’: 2})

However, it does not work like I want it to. It seems to immediately refresh the page, then I get the upload file selection dialog but the file is never uploaded. It appears to trigger the callback before the file selection dialog even shows up. Since I haven’t even selected a file, the file contents and filename is None.

Without the html.A around the upload the upload works as desired but the page is not refreshed.

How can I get both to happen? 1. upload the file and 2. refresh the page

---

<div class="post-metadata">

**Author:** ![jlfsjunior](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/jlfsjunior/32/16061_2.png) [@jlfsjunior](https://community.plotly.com/u/jlfsjunior)\
**Post date:** [May 19, 2022, 8:06pm UTC](https://community.plotly.com/t/how-to-refresh-page-after-upload/64286/2 "2022-05-19T20:06:09Z")

</div>

You could try to add a `dcc.Location(id="url")` component in the app and use `Output("url", "pathname") in the callback to upload the files. Then if you return "/" (and `refresh=True`), the page would refresh if the upload is complete.

---

<div class="post-metadata">

**Author:** ![Brent](https://avatars.discourse-cdn.com/v4/letter/b/ec9cab/32.png) [@Brent](https://community.plotly.com/u/Brent)\
**Post date:** [May 19, 2022, 9:21pm UTC](https://community.plotly.com/t/how-to-refresh-page-after-upload/64286/3 "2022-05-19T21:21:55Z")

</div>

Thank you. Yes, that did work. It is a multipage app though so I did not use ‘/’. I used the url for that page. I guess only one page could refresh this way since we can only have one output for the same id? How would I do it if I wanted to refresh more than one page?

---

<div class="post-metadata">

**Author:** ![Emil](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/emil/32/31734_2.png) [@Emil](https://community.plotly.com/u/Emil)\
**Post date:** [May 20, 2022, 4:08am UTC](https://community.plotly.com/t/how-to-refresh-page-after-upload/64286/4 "2022-05-20T04:08:05Z")

</div>

In that case, you could merge all logic into one callback (with appropriate branching, depending on what input triggered the callback), or you could use the MultiplexerTransform,

> **[MultiplexerTransform](https://www.dash-extensions.com/transforms/multiplexer-transform)**
