azmi
October 18, 2017, 9:32am
1
I am able to display a dash table using https://github.com/plotly/dash-table-experiments/blob/master/usage.py .
Now, I want to display the same table in a multi page dash app.
I started with https://github.com/plotly/dash-recipes/blob/master/urls/multi_page.py and added the necessary code to display a table.
imports
import dash_table_experiments as dt
import pandas as pd
load a dataframe
DF_GAPMINDER = pd.read_csv(
'https://raw.githubusercontent.com/plotly/datasets/master/gapminderDataFiveYear.csv'
)
DF_GAPMINDER = DF_GAPMINDER[DF_GAPMINDER['year'] == 2007]
DF_GAPMINDER.loc[0:20]
add a table to a layout
dt.DataTable(
rows=DF_GAPMINDER.to_dict('records'),
selected_row_indices=[],
id='datatable-gapminder'
),
I will get the following exception
Uncaught (in promise) Error: dash_table_experiments was not found.
at Object.resolve (bundle.js?v=0.11.0:9)
at s (bundle.js?v=0.11.0:9)
at Array.map (<anonymous>)
at s (bundle.js?v=0.11.0:9)
at Array.map (<anonymous>)
at s (bundle.js?v=0.11.0:9)
at Array.map (<anonymous>)
at s (bundle.js?v=0.11.0:9)
at e.value (bundle.js?v=0.11.0:9)
at p._renderValidatedComponentWithoutOwnerOrContext (react-dom@15.4.2.min.js?v=0.11.0:13)
HansG
October 18, 2017, 10:09am
2
This error was already discussed a several times.
Dash is designed to load all it’s dependencies according to the components on the first visible page.
If you want to use a table on another page than the first one, you have to add an empty hidden table on the first page.
html.Div(dt.DataTable(rows=[{}]), style={'display': 'none'}),
2 Likes
azmi
October 18, 2017, 10:45am
3
I removed all my tables and added just your empty table to the first page and still get the same exception. Do you have working example?
HansG
October 18, 2017, 10:54am
4
The issue was last discussed 7 days ago (with code)
Hi!
I tried to split the app I’m working on into 2 pages using the URL support and it seems that the tables break down the app.
Did someone notice that before?
Below a code example :
import dash
import dash_core_components as dcc
import dash_html_components as html
import dash_table_experiments as dtable
import pandas as pd
print(dcc.version) # 0.6.0 or above is required
app = dash.Dash()
app.config.supress_callback_exceptions = True
app.layout = html.Div([
dcc.Location(id=‘url’, r…
2 Likes
azmi
October 18, 2017, 3:09pm
5
Cool! Table now works as expected. Thanks!
1 Like
In case anyone is wondering what the problem is, here is the explanation (with code to fix it):
@HansG Thanks for reporting! I see what’s going on here.
A little context: When Dash serves the page, it crawls the app.layout to see which component libraries are being used (e.g. dash_core_components). Then, with this list of unique component libraries, it serves the necessary JS and CSS bundles that are distributed with those component libraries.
In this case, we’re serving dash_table_experiments on a separate page, as the response of a callback. Dash only sees dash_html_components and dash…