Quantcast
Channel: 🎛️ Dash - Plotly Community Forum
Viewing all articles
Browse latest Browse all 6271

Interval callback for dynamically updating single dropdown list

$
0
0

Hello, I have spent 2-3 weeks trying to do this and would very much appreciate some help as I’m really struggling to complete my task. I am creating a web app where I need to poll an API every second and dynamically update a drop down. I have this currently working to create a list of buttons dynamically however I need to transition this functionality to a dropdown (ore checklist) as I need multi-select functionality.

Working callback for button list where the function detect_drones() returns a 2d array with information on devices i.e
Devices = [[“Phone”, “Mac Address”], [“Phone”, “Mac Address”]]

app.layout = html.Div([
    html.Div([
        html.H1('Devices dentified'),
        html.Span(className='boxLine'),

        #Nav is used to create a scroll bar.
        html.Nav([
        html.Ul([
            html.Span(id='buttonCreation'),
        ])
       ])
    ], className='droneBox'),
    dcc.Interval(
        id='interval-component',
        interval=5000,
        n_intervals=0
    ),
])

#Callback to create a button on every detected device
@app.callback(
    dd.Output('buttonCreation', 'children'),
    [dd.Input('interval-component', 'n_intervals')]
)
def create_buttons(frame):
    buttons = []
    detected_devices = server_V_0_5.detect_devices()
    if len(detected_devices) == 0:
        return html.H2('No devices deteced.')
    else:
        for i, device in enumerate(detected_device):
            #If the name is empty
            if device[1] == "":
                device[1] = device[2]
            buttons.append(html.Button(f"{drone[1]}", id=f"D{i+1}")) 
    return buttons

if __name__ == '__main__':
    app.run_server(debug=True)

Here is some idea from another post

app = dash.Dash()

app.layout = html.Div(
    [
        html.Div([
        dcc.Dropdown(
            id='name-dropdown',
            options=[{'label':name, 'value':name} for name in names],
            value = list(fnameDict.keys())[0]
            ),
            ],style={'width': '20%', 'display': 'inline-block'}),
        
        ),
    ]
)

@app.callback(
    dash.dependencies.Output('opt-dropdown', 'options'),
    [dash.dependencies.Input('name-dropdown', 'value')]
)
def update_date_dropdown(name):
    opts = fnameDict[name]
    options=[{'label':opt, 'value':opt} for opt in opts]
    return {'options':options}

if __name__ == '__main__':
    app.run_server(debug=True)

Is there a way I can have a dropdown which using interval, dynamically adds elements to the dropdown based off a 2d array. Thank you, any help is much appreciated.

1 post - 1 participant

Read full topic


Viewing all articles
Browse latest Browse all 6271

Trending Articles