RadioItems show different numbers of dropdowns

Dash Python
1

Hi

I have three RadioItems 1,2 &3, I want:

Select RadioItem 1, show 1 dropdown
Select RadioItem 2, show 2 dropdowns
Select RadioItem 3, show 4 dropdowns

if anyone knows how to do it plz?

2

I solved it myself

TTFtech_layout = html.Div([
dcc.RadioItems(
id=‘signal-type’,
options=[{‘label’:‘Flat’, ‘value’:‘Flat’},
{‘label’:‘Time Spread’,‘value’:‘Time Spread’},
{‘label’:‘Box’, ‘value’:‘Box’}],
value=‘Intraday’,
#labelStyle={‘display’: ‘inline-block’}
),
html.Div(id=‘dropdown-container’, children=),
html.Div(id=‘dropdown-container-output’)

        ])

@app.callback(
Output(‘dropdown-container’, ‘children’),
Input(‘signal-type’, ‘value’),
State(‘dropdown-container’, ‘children’))
def display_dropdowns(values, children):

if values == 'Flat':
    new_dropdown = dcc.Dropdown(
        options=[{'label':'Aug', 'value':'Aug'},
                 {'label':'Sep', 'value':'Sep'},
                 {'label':'oct', 'value':'oct'},
                 {'label':'nov', 'value':'nov'}],
        placeholder="Select a Contract",
        id={
        'type': 'flat-dropdown',
        'index': values
    }
    )
    
    return new_dropdown

if values == 'Time Spread':
    new_dropdown1 = dcc.Dropdown(
        options=[{'label':'Aug', 'value':'Aug'},
                 {'label':'Sep', 'value':'Sep'},
                 {'label':'oct', 'value':'oct'},
                 {'label':'nov', 'value':'nov'}],
        placeholder="Select Contract 1",
        id={
        'type': 'ts-dropdown1',
        'index': values
    }, style={'width': '48%', 'display': 'inline-block'}
    ) 
    new_dropdown2 = dcc.Dropdown(
        options=[{'label':'Aug', 'value':'Aug'},
                 {'label':'Sep', 'value':'Sep'},
                 {'label':'oct', 'value':'oct'},
                 {'label':'nov', 'value':'nov'}],
        placeholder="Select Contract 2",
        id={
        'type': 'ts-dropdown1',
        'index': values
    }, style={'width': '48%', 'display': 'inline-block'}
    )

    return new_dropdown1, new_dropdown2

if values == 'Box':
    new_dropdown1 = dcc.Dropdown(
        options=[{'label':'Aug', 'value':'Aug'},
                 {'label':'Sep', 'value':'Sep'},
                 {'label':'oct', 'value':'oct'},
                 {'label':'nov', 'value':'nov'}],
        placeholder="Select Contract 1",
        id={
        'type': 'box-dropdown1',
        'index': values
    }, style={'width': '48%', 'display': 'inline-block'}
    ) 
    new_dropdown2 = dcc.Dropdown(
        options=[{'label':'Aug', 'value':'Aug'},
                 {'label':'Sep', 'value':'Sep'},
                 {'label':'oct', 'value':'oct'},
                 {'label':'nov', 'value':'nov'}],
        placeholder="Select Contract 2",
        id={
        'type': 'box-dropdown2',
        'index': values
    }, style={'width': '48%', 'display': 'inline-block'}
    )
    new_dropdown3 = dcc.Dropdown(
        options=[{'label':'Aug', 'value':'Aug'},
                 {'label':'Sep', 'value':'Sep'},
                 {'label':'oct', 'value':'oct'},
                 {'label':'nov', 'value':'nov'}],
        placeholder="Select Contract 3",
        id={
        'type': 'box-dropdown3',
        'index': values
    }, style={'width': '48%', 'display': 'inline-block'}
    ) 
    new_dropdown4 = dcc.Dropdown(
        options=[{'label':'Aug', 'value':'Aug'},
                 {'label':'Sep', 'value':'Sep'},
                 {'label':'oct', 'value':'oct'},
                 {'label':'nov', 'value':'nov'}],
        placeholder="Select Contract 4",
        id={
        'type': 'box-dropdown4',
        'index': values
    }, style={'width': '48%', 'display': 'inline-block'}
    )
    
    
    return new_dropdown1, new_dropdown2, new_dropdown3, new_dropdown4