Hi All,
I’m trying to create a multi-page app,
and I would like to refresh page content( also dataframe) on refresh, I have followed https://dash.plot.ly/live-updates but for some reason its not updating.
Can someone please help me or guide me in the right direction.
Below are the codes, Thanks in advance
app.py
import dash
app = dash.Dash(__name__, meta_tags=[{"name": "viewport", "content": "width=device-width"}])
server = app.server
app.config.suppress_callback_exceptions = True
index.py
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Input, Output
# Import app
from app import app
# Import Pages
from page1 import *
from page2 import *
#import menu
from menu import menu
menu = menu()
def serve_layout():
return html.Div(
[
dcc.Location(id = 'url', refresh = False),
html.Div(id = 'page-content')
]
)
app.layout = serve_layout
# Index Callbacks-------------------------------------------------------------------------------------------------------
@app.callback(Output('page-content', 'children'),[Input('url', 'pathname')])
def display_page(pathname):
if pathname == '/page2':
return html.Div([menu,page2_layout])
elif pathname in ["/", "/page1"]:
return html.Div([menu,page1_layout])
# If the user tries to reach a different page, return a 404 message
return html.Div(
[
menu,
html.Div(
[
html.H1("404: Not found", className="text-danger"),
html.Hr(),
html.P(f"The pathname {pathname} was not recognised..."),
]
)
]
)
if __name__ == '__main__':
app.run_server(debug=True)
page1.py
import dash_core_components as dcc
import dash_html_components as html
import datetime
page1_layout = html.Div(
[
html.H1('The time is: ' + str(datetime.datetime.now())),
html.P('this is page 1!')
],
className='main_content'
)
page2.py
import dash_core_components as dcc
import dash_html_components as html
import datetime
import pandas as pd
filepath = 'test.csv'
#imported dataframe
test_df = pd.read_table(filepath)
page2_layout = html.Div(
[
html.H1('The time is: ' + str(datetime.datetime.now())),
html.P('this is page 2!')
],
className='main_content'
)
menu.py
import dash_html_components as html
import dash_core_components as dcc
def menu():
return html.Div(
id="app_heading",
className="class_app_heading",
children=[
html.Div(
id="app_logo",
children=[
html.Img(src='/assets/logo.png')
],
),
html.Div(
id="app-menu",
className="class_app_menu",
children=[
dcc.Link('Page1',
href='/page1',
id='id_page_1',
className='active'
),
dcc.Link('Page2',
href='/page2',
id='id_page_2',
),
],
),
],
)