I’ve been loving the dash_table_experiments, and I’m looking for one last feature to make it fully match my use case: embedding links in cells. I know there’s been a lot of work to enable components as cells, and that it’s dependent on work being done on a render component prop, but I’m wondering if there’s any workaround I could potentially use now to dynamically populate cells with links.
For example, when I run the following, I (predictably) get Error loading layout because Objects are not valid as a React child (found: object with keys {type, namespace, props}).:
#!/usr/bin/env python
# -*- coding: utf-8 -*-
import pandas as pd
import dash
import dash_table_experiments as dt
import dash_html_components as html
app = dash.Dash()
app.css.append_css({"external_url":
"https://codepen.io/chriddyp/pen/bWLwgP.css"})
def main():
df = pd.read_csv('https://raw.githubusercontent.com/plotly/datasets/master/gapminderDataFiveYear.csv')
links = [html.A('Navigate to "/{}"'.format(a), href='/{}'.format(a))
for a in range(df.shape[0])]
df['links'] = pd.Series(links, index=df.index)
return dt.DataTable(rows=df.to_dict('records'),
columns=df.columns,
filterable=True,
sortable=True,
selected_row_indices=[],
)
app.layout = html.Div(main(), style={
'width': '100%',
'maxWidth': '1200px',
'margin': '0 auto'
})
if __name__ == '__main__':
app.run_server(debug=True)
How might I find a workaround to put links in cells?
There isn’t a workaround in the dash-table-experiments repo. However, you could just render the table as an html.Table and then you can embed html.A within the table cells.
I have tried using dcc.markdown, html.Link, and there is no way to embed links. Neither the conditional cells someone else suggested with specific versions of the components (I did not get them to work).
I am currently using the html.Table(), however, my tables are quite long and I miss the headers…Filter is also quite useful now that I’ve tried it a lot.
It is a pity there is no solution for embedding links. The dash table experiments is so awesome and I would really love using it now. I am sorry I can’t use it this time, but I need to provide a link in the cells (so the user can navigate to other tables).
I noticed the previous posts were from August. Is there any news?
Thank you so much for all the work and patience!
One hack I found for this is to use dcc.Location. In my case, I had a multi-page app and in one of the pages I used pseudo GET parameters (so for example, if you went to my-app/app1/my-param, app1 would be rendered using my-param as the value in an input). What I did is create a callback that takes the clicked cell in the table as input, and outputs the pathname of the location component. If the user clicked a cell in the column with the “links”, the callback took the cell ID and changed the pathname to the corresponding address, which triggers an app reload.
I don’t know if this would work for external addresses though. Being able to add links to the tables (or even better, markup as in the tooltips) would be a great addition to the table and the only thing missing for me right now after the last release fixed filtering a lot.
Locking this answer since it’s about dash-table-experiments, an experimental project that we no longer maintain. Now we maintain dash-table, and embedding links inside cells is possible with the new markdown presentation option - dash_table.DataTable Embedded Links.
