Hi everyone,
I have an issue with the disabling of a tab with using a callback. The app below is supposed to load with tab 2 disabled. Tab 2 is supposed to be unabled whenever the user selects a price different from 0 with the slider. However, the tab is never disabled whenever I load the app.
Some help would be welcome !
Thanks in advance,
Antoine
Here is the script :
import dash
from dash.dependencies import Input, Output
import dash_core_components as dcc
import dash_html_components as html
app = dash.Dash()
app.layout = html.Div([
dcc.Tabs(id='main_tab', children=[
dcc.Tab(id='tab_1',
label='TAB 1',
style={
'color':'black',
'border-radius':'10px 10px 10px 10px',
'marginLeft':50,
},
selected_style={
'color':'black',
'border-radius':'10px 10px 10px 0px',
'marginLeft':50,
},
children=[
html.Br(),
html.Div(id='slider_output_price',
style={'display':'inline-block',
'width':'83.75%',
'font-size': 14,
'marginLeft':20}),
html.Br(),
html.Div([
dcc.Slider(id='price',
min=0,
max=1000000,
step=5000,
value=0,
marks={
0: {'label': '0€'},
250000: {'label': ''},
500000: {'label': ''},
750000: {'label': ''},
1000000: {'label': '1M'}},
updatemode='drag'),
],
style={'marginLeft':20,
'width':'90%',
'font-size': 14}),
]),
# Titre onglet
dcc.Tab(id='tab_2',
label="TAB 2",
style={
'color':'black',
'border-radius':'10px 10px 10px 10px',
'marginLeft':5,
},
selected_style={
'color':'black',
'border-radius':'10px 10px 10px 0px',
'marginLeft':5,
},
disabled_style={
'color':'grey',
'border-radius':'10px 10px 10px 0px',
'marginLeft':5,
},
children=[
]),
]),
])
activation tab 2
@app.callback(
[Output(component_id=‘tab_2’, component_property=‘disabled’)],
[Input(component_id=‘price’, component_property=‘value’)]
)
def disable_tab_2(price):
if price == 0:
disabled = True
else:
disabled = False
return disabled
display slider price
@app.callback(
Output(component_id=‘slider_output_price’, component_property=‘children’),
[Input(component_id=‘price’, component_property=‘value’)],
)
def slider_net_vendeur(value_price):
return ‘price : {0:,} €’.format(value_price).replace(’,’, ’ ')
if name == ‘main’:
app.run_server(debug=False)