Multi-Page App and URL Support

Dash Python
1

I am looking for some help with implementation of URL support into multi-page app with page_registry.

Reqs:
URL gets generated based on dropdown values.
A user can reach the same filtration values either via selecting values from dropdown (existing functionality) or with pasting URL into browser.

2

Yes, that’s possible. Can you say more about what you’ve tried so far?

3

Thanks to suggestions of @jinnyzor I have been able to make this work in multipage app if I querystring URL and output it as dcc.Location.

This works fine if in a certain page I use:

def layout(**kwargs):
    return html.Div([
    dcc.Location(id='url', refresh=False),
    dbc.Container(
    [
        html.Br(),
        dbc.Offcanvas(
            id="chartEditor"
        ),
        dbc.Row([
            dbc.Col(
                dcc.Dropdown(
                    id='diss_project',
                    options=diss_project_dropdown(),
                    value=kwargs.get("project"),
                ),
                width=4,
            ),

However, my app is slightly more complicated since it has dropdowns that are common to all of the pages. I define those as upper_level_filters in app.layout.

app.py:

def layout(**kwargs):
    return html.Div([
    dcc.Location(id='url', refresh=False),
    dbc.Container(
    [navbar, nav_links, upper_level_filters(**kwargs), page_container 
     ], fluid=True, className="dbc"
)
    ])

app.layout = layout

upper_level_filters.py

def upper_level_filters(**kwargs):
    return dbc.Container(
        [
            dbc.Row([
                dbc.Col(
                    dcc.Dropdown(
                        id='diss_project',
                        options=diss_project_dropdown(),
                        value=kwargs.get("project"),
                    ))

In this case I would get dash error:

dash\dash.py", line 2085, in update
    else layout(**query_parameters)
TypeError: layout() got an unexpected keyword argument 'project'

I would guess this is due to **kwargs being passed to page layouts instead of app.layout.