Hi,
With the example with multi_page_table_links, I had tried to create something similar to the sample.
I able to display the page1 but not page2. When I click the ‘view’ for any one of the row, it is success to go to another page but it is blank.
Could anyone assist on this?
dataframe:
| Reference ID | Customer | Product | Sale reference | Sale Date |
|---|---|---|---|---|
| 1 | Customer 1 | Desktop | sale001 | 08/11/2022 |
| 2 | Customer 2 | Laptop | sale002 | 08/11/2022 |
| 3 | Customer 3 | Keyboard | sale003 | 11/11/2022 |
| 4 | Customer 4 | Mouse | sale004 | 12/11/2022 |
| 5 | Customer 5 | Pendrive | sale005 | 25/11/2022 |
| 6 | Customer 6 | Hard disk | sale006 | 01/12/2022 |
| 7 | Customer 7 | Mouse pad | sale007 | 13/12/2022 |
| 8 | Customer 8 | Desktop | sale008 | 08/11/2022 |
| 9 | Customer 9 | Laptop | sale009 | 08/11/2022 |
| 10 | Customer 10 | Keyboard | sale010 | 11/11/2022 |
| 11 | Customer 11 | Mouse | sale011 | 12/11/2022 |
| 12 | Customer 12 | Pendrive | sale012 | 25/11/2022 |
| 13 | Customer 13 | Hard disk | sale013 | 01/12/2022 |
| 14 | Customer 14 | Mouse pad | sale014 | 13/12/2022 |
expected output:
page1
page2
Below are the code:
app.py
import plotly.express as px
from plotly.offline import plot
import dash
from dash import dcc, html, callback
# import dash_core_components as dcc
# import dash_html_components as html
from dash.dependencies import Output,Input, State
import dash_bootstrap_components as dbc
from dash import dash_table
from dash_table import DataTable, FormatTemplate
import pandas as pd
import pandas_datareader.data as web
from datetime import date, datetime
import pyodbc
import os
import psycopg2
from plotly.io import write_image
import flask
import base64
# Dashboard layout
app= dash.Dash(__name__,external_stylesheets=[dbc.themes.BOOTSTRAP],
meta_tags=[{'name': 'viewport',
'content': 'width=device-width, initial-scale=1.0'}],
use_pages=True
)
app.layout = dbc.Container([
dbc.Row([#html.H5('test'),
dash.page_container
]),
],
fluid = True
)
if __name__ == "__main__":
app.run_server(debug=True, port=1015)
page1.py
import plotly.express as px
from plotly.offline import plot
import dash
from dash import dcc, html, callback
from dash.dependencies import Output,Input, State
import dash_bootstrap_components as dbc
from dash import dash_table
from dash_table import DataTable, FormatTemplate
import dash_bootstrap_components as dbc
import pandas as pd
import pandas_datareader.data as web
from datetime import date, datetime
import pyodbc
import os
import psycopg2
from plotly.io import write_image
import flask
import base64
dash.register_page(__name__,
path="/",
title= 'Main')
df= pd.read_csv("dataframe.csv")
product_cat = list(df['Product'].unique())
layout = dbc.Container([
dcc.Store(id = 'store', storage_type = 'session'), #data={} , data=df.to_dict("records")
dcc.Store(id = 'store1', storage_type = 'session'),
dbc.Row([
dbc.Col(html.H1("Listing",
className = 'text-center text-primary, mb-4 '
,style={"textDecoration":"underline",'font-weight': 'bold'}),
width=12
),
]),
html.Br(),
html.Br(),
dbc.Row([
dbc.Col([
html.H3('Product'
,style={'font-size': '25px'}
),
], width=3, md=4),
dbc.Col([
dcc.Dropdown(id='product_dd', value= None,
options = [{'label':x, 'value':x}
for x in product_cat],
searchable = True, search_value='',
placeholder= 'Please select ...',
clearable= True
),
], width=3, md=4),
]),
html.Br(),
dbc.Row([
dbc.Col([
html.H3('Sale Date'
,style={'font-size': '25px'}
),
], width=3, md=4),
dbc.Col([
dcc.Dropdown(id='date_dd', value= '',
searchable = True, search_value='',
placeholder= 'DD/MM/YYYY',
clearable=True
),
], width=3, md=4),
dbc.Col([
html.H3('i.e: 15/11/2022'
,style={'font-size': '15px'}
),
], width=3, md=4),
], ), #style={"flexWrap": "wrap", "width":"250px"}
html.Br(),
dbc.Row([
dbc.Col([
html.P("Listing",
style={"textDecoration":"underline"}),
dash_table.DataTable(id='tablelisting',
columns=[
{'name': 'Customer', "id": 'Customer'},
{'name': 'Product', 'id':'Product'},
{'name': 'Sale Date', 'id':'Sale Date'},
{'name': 'Details', 'id':'view', 'type':'text', 'presentation':'markdown'},
],
style_cell={'textAlign': 'left'},
# markdown_options = {'link_target': '_self'}
),
]),
]),
],
)
@callback(
Output('date_dd','options'),
Input('product_dd', 'value')
)
def update_dd (product_dd):
date = df.drop_duplicates(['Sale Date'], inplace= False)
relevant_date = date[ df['Product'] == product_dd]['Sale Date'].values.tolist()
date_option= [dict(label=x,value=x)for x in relevant_date]
return date_option
@callback(
Output('store','data'),
Input('date_dd', 'value'),
)
def get_data (ddate):
return ddate
# #TABLE
@callback(
Output('tablelisting', 'data'),
Input('store', 'data')
)
def update_table(selection):
if len (selection) == 0:
return dash.no_update
else:
dff = df[(df['Sale Date'] == selection)]
equit = dff['Customer'].to_list()
dff['view'] = [f"[View](/details/{ticker})" for ticker in equit]
columns = dff[['Customer', 'Product', 'Sale Date','view']]
data= columns.to_dict('records')
return data
page2.py
import plotly.express as px
from plotly.offline import plot
import dash
from dash import dcc, html, callback
from dash.dependencies import Output,Input, State
import dash_bootstrap_components as dbc
from dash import dash_table
from dash_table import DataTable, FormatTemplate
import dash_bootstrap_components as dbc
import pandas as pd
import pandas_datareader.data as web
from datetime import date, datetime
import pyodbc
import os
import psycopg2
from plotly.io import write_image
import flask
import base64
import json
def title(ticker=None):
return f"{ticker} Analysis"
dash.register_page(__name__,
path_template='/details/<ticker>',
path="/details/customer1",
title = title)
# # read data from csv
df= pd.read_csv("dataframe.csv")
def layout(ticker= None, **other_unknown_query_strings):
layout = dbc.Container([
dbc.Row([
dbc.Col([
html.P(f"Profile: {ticker}",
style={"textDecoration":"underline"}),
dash_table.DataTable(id='tableprofile',
columns=[
{'name': '', "id": 'header'},
{'name': 'Information', "id": 'info'},
],
),
html.Br(),
]),
]),
])
return layout
@callback(
Output('tableprofile', 'data'),
Input('store','data')
)
def update_table(selection):
if len (selection) == 0:
return dash.no_update
else:
dff = df[df['Sale Date'] == selection]
transpose = dff.melt(id_vars = ['Reference_ID']
,var_name = ['header']
,value_name = 'info')
info = transpose[transpose['header'].isin(['Customer','Product', 'Sale reference, 'Sale Date' ])]
columns = info[['header','info']]
data= columns.to_dict('records')
return data