Issue with `dcc.Location` used in Refresh Callbacks in Multi-Page Dash App

Hello everyone,

I’m currently developing a multi-page data app to insert and explore data from my database.

I’m facing an issue where my AG Grid components (and other elements displaying database data) are not refreshed when I display a page. To address this, I created a callback that detects the ID of dcc.Location on page display using the callback_context.triggered_id parameter. However, it doesn’t work as expected.

Here’s what happens:

  • When I land on a page, the dcc.Location ID is not triggered.
  • When I leave the page, the dcc.Location of the new page triggers the callback of the page I just left.

I’m using independent dcc.Location components on each page with unique IDs. I also tried using a global dcc.Location in app.py, but the behavior persists.

Could someone explain why this happens or provide guidance on how to ensure that each page refreshes its data properly upon display?

Here’s a callback example:

dcc.Location(id="url", refresh=False),

@callback(
    Output("grid", "rowData"),
    Output("last-refresh", "children", allow_duplicate=True),
    Input('url', 'pathname'),
    prevent_initial_call=True,
)
def refresh_data(pathname):
    ctx = callback_context
    triggered_id = ctx.triggered_id
    
    if  triggered_id="url":
        rowdata, message = refresh_grid()
        return rowdata, message
    else:
        return no_update, no_update

Thanks in advance for your help!

Hi @Fatima24 and welcome to the Dash community :slight_smile:

You should only use one dcc.Location component and if it’s in the main app.py then it will be accessible to any page.

There is not quite enough code here to understand the problem. Can you make a complete minimal example that will demonstrate the issue?