How to make table cell values hyperlinked in Dash? (Using Plotly, Dash, Pandas, etc.)-PHP Chinese Network Q&A

I want to set the cell value under the "JobLink" column as a hyperlink. When I click this link it should navigate to the link in a new tab/window. Please help how to achieve this? The table is displayed in Dash and I'm finding it difficult to make it hyperlinked. Attached screenshot: https://i.stack.imgur.com/yIAqH.png [![Enter image description here][2]][2] [![Data table displayed in Dash http://127.0.0.1:80/ ][1]][1]

for sheet in all_sheets_df.keys(): df1 = pd.read_excel(filePath, sheet) joblink = "http://" + sheet + ".googletest.org:8080/bob/" + df1['Name'] df1['Job Link'] = joblink dftable = [ dash_table.DataTable( columns=[{"name": i, "id": i} for i in df1.columns], data=df1.to_dict('records'), page_action='none', #filter_action="native", style_table={'overflowX': 'auto','overflowY': 'auto','width': '80%','margin-left': 'auto','margin-right': 'auto','height': '200px'}, style_cell={'whiteSpace': 'normal','height': 'auto','textAlign': 'left'}, style_header={'backgroundColor': '#1e4569','fontWeight': 'bold','color': 'white'}, style_cell_conditional=[ {'if': {'column_id': 'Status'}, 'width': '120px'}, {'if': {'column_id': 'Passed'}, 'width': '120px'}, {'if': {'column_id': 'Last Build Date'}, 'width': '150px'}, ], style_data_conditional=[ { 'color': 'blue', 'fontWeight': 'bold' }, { 'if': { 'filter_query': '{Status} = "Success" || {Status} = "SUCCESS"', 'column_id': 'Status' }, 'color': 'green', 'fontWeight': 'bold' }, { 'if': { 'filter_query': '{Status} = "Failure" || {Status} = "FAILURE"', 'column_id': 'Status' }, 'color': 'red', 'fontWeight': 'bold' }, ] ) ] sheet_list.append(dcc.Tab(dftable,label=sheet,id=sheet,value=sheet,selected_className='custom-tab--selected')) # print(sheet_list) for tab_name, df in all_sheets_df.items(): df['sheet_name'] = tab_name all_dfs.append(df) final_df = pd.concat(all_dfs, ignore_index=True) fig = px.pie(final_df.to_dict('records'), names="Status", hole=.5, , color='Status') pieChart = dcc.Graph(id='pie', figure=fig) app.layout = html.Div([ dcc.Tabs(sheet_list, id="tabs-with-classes", value='tab-1', parent_className='custom-tabs', className='custom-tabs-container', colors={ "border": "white", "primary": "grey", "background": "silver" }, ), html.Div(id="tab-content", className="p-4"), html.Div(pieChart) ])``` [1]: https://i.stack.imgur.com/yIAqH.png [2]: https://i.stack.imgur.com/gVwFj.png

from dash import Dash from dash_table import DataTable import pandas as pd df = pd.DataFrame( { "Job Link": [ "https://www.google.com/", "https://www.google.com/", "https://www.google.com/", ] } ) app = Dash(__name__) app.layout = DataTable( id="table", data=df.to_dict("records"), columns=[ {"id": "Job Link", "name": "Job Link", "presentation": "markdown"}, ], markdown_options={"html": True}, ) if __name__ == "__main__": app.run_server()