✊🏿 Black Lives Matter. Please consider donating to Black Girls Code today.
🐇 Announcing Dash VTK for 3d simulation graphics. Check out the March webinar.

Enable component via other components

I have two input fields in my application. I want one of them to get enabled on clicking a checkbox/radio button. How can I achieve this functionality?


For this thing I use

  • Style={
  • ‘display’:none}

on componenet I want to show by defalout in page layout and

  • Style={
  • ‘display’:‘block’} (for example)

in output from checkbox/radio button.

Its look like

 @app.callback(dash.dependencies.Output('Class_Div', 'style'),   #component you want to show
               [dash.dependencies.Input('interface', 'values')            #checkbox/radio buttonyou shold to push
 def update_drop_class(val):
         if 'Class' in val:
             style_class = {'display': 'inline-block',
                            'width': '7.69%'

         if 'Class' not in val:
             style_class = {'display': 'none',
                            'width': '7.69%'
     except Exception as e:
         return html.Div([
             'There was an error'
     return style_class