import dash_core_components as dcc
import dash_bootstrap_components as dbc
import dash_html_components as html
from dash.dependencies import Input, Output, State
from app import app
my_stances = [
{
'value' : 'rock',
'label' : 'rock'
},
{
'value' : 'paper',
'label' : 'paper'
},
{
'value' : 'scissors',
'label' : 'scissors'
}
]
stance_information = {
'rock' : 'A rock is round. Defeated by [want hyperlink]paper.',
'paper' : 'Paper is flat. Defeated by [want hyperlink]scissors.',
'scissors' : 'Scissors are sharp. Defeated by [want hyperlink]rock.'
}
stance_lookup_dropdown = dcc.Dropdown(options=my_stances, searchable=True, id='stance_dropdown', placeholder='Select a stance' )
layout = dbc.Container([
stance_lookup_dropdown,
html.Div([
html.P('')
], id='stance_info'),
],fluid=True)
@app.callback(
Output(component_id="stance_info", component_property='children'),
Input(component_id="stance_dropdown", component_property='value')
, prevent_initial_call=True
)
def update_stance_information(selected_stance):
return html.P(stance_information.get(selected_stance,'????'))
In this simple example above, I want to have a hyperlink that triggers a callback to update the page layout based on the content held in the stance_information dictionary.
I feel like there’s and easy way to do this, but I’m having trouble finding examples where callbacks can be triggered not using a dcc input component.
Thank you