Hi All, I just started using dash framework to create dashboard.I am creating multi page app. First page will ask user to enter access token and click on submit button actual Dashboard page will load up. I have added dcc.Link on html.button. Plesae check below code and suggest me what i am doing wrong.
import dash_core_components as dcc
2 import dash_html_components as html
3 from dash.dependencies import Input, Output, State, Event
4 from app import app
5 import figures
6 app.config.suppress_callback_exceptions = True
7
8 app.layout = html.Div([
9 dcc.Location(id=âurlâ, refresh=False),
10 html.Div(id=âpage-contentâ)
11 ])
12
13 index_layout = html.Div(children=[
14 # dcc.Location(id=âurlâ, refresh=False),
15 # html.Div(id=âpage-contentâ),
16
17 html.H4(âPlease add Access Tokenâ, hidden=False, id=âpage_headerâ),
18 # Access form
19 html.Div(children=[
20 html.P(children=["Access Token: ",
21 dcc.Input(type=âtextâ, id=âinput-boxâ, placeholder=âAccess Tokenâ)]),
22 dcc.Link(html.Button(âSubmitâ, id=âsubmitâ, type=âsubmitâ), href=â/dash-1â)
23 ], style={âwidthâ : â30%â, âmarginâ : â0 autoâ, âalignâ : âcenterâ},
24 id=âlogin_formâ, hidden=False)
25 ], style={âdisplayâ : âblockâ, âtextAlignâ : âcenterâ, âpaddingâ : 2,
26 âalignâ : âcenterâ, âmarginBottomâ: 50, âmarginTopâ: 25})
27 #html.Br(),
28 #html.Hr(style={âwidthâ : â30%â}),
29 # footer
30 # html.Div(children=[
31 # ], style={âpaddingâ : 7, âtext-alignâ : âcenterâ})
32 #])
33
34 @app.callback(Output(âpage-contentâ, âchildrenâ),
35 [Input(âurlâ, âpathnameâ)],
36 [State(âinput-boxâ, âvalueâ)],
37 [Event(âsubmitâ, âclickâ)])
38 def display_page(pathname, value):
39 if pathname == â/dash-1â:
40 print(âPlease wait⌠Dashboard is fetching data from gitlabâ)
41 return figures.serve_layout(value)
42 else:
43 return None
44
Figures.py file have basic graph to show up
45 #app.scripts.config.serve_locally = True
46 external_css = [âhttps://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.cssâ, #pylint: disable=invalid-name
47 âhttps://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.cssâ, ]#pylint: disable=invalid-name
48
49 for css in external_css:
50 app.css.append_css({âexternal_urlâ: css})
51 if name == âmainâ:
52 app.run_server(debug=True)