How to access values from a list of dynamically generated sliders

Dash Python
1

I am working on a dashboard which have a list generate from one tab, that can be a global variables, and a panel of several slider will be generated based on that list. I am having a hard time figure out how to access the value from those dynamically generated sliders.
Here are the pseudo code for my problems

global some_list

app.layout = html.Div([
    html.Div(id='few_sliders'),
    html.Div(id='slider_output_container', style={'display':'none'}),
    html.Div(id='container_2', children=some_list, style={'display':'none'})
])

@app.callback(Output('few_sliders','children'),[Input('container_2','children')])
def generate_several_sliders(some_list):
    return html.Div([dcc.Slider(id=f'slider_{i}') for i in some_list])

input_list = [Input(f'slider_{i}','value') for i in some_list]
@app.callback(Output('slider_output_container','children'),input_list)
def do_something(*slider_values):
    # pass
    return

The only way I can think of now is to make the list global, but I don’t think this is the right way to do it. Can anyone help? Thanks in advance.

2

Hey,

I’ve heard many times the creator of Dash saying that global variables will break your app.

To access your dynamically created component, you should create callbacks (dynamically or not) at page load

1 Like
3

Hi jajarbins, the problem I am having is in my callback, how to access those dynamically generate sliders id, and access their value. Say, if I use the callback as:

app.callback(Output('slider_output_container','children'),[Input('few_sliders', 'children')])

how then can I access the sliders individual outputs without calling their id in a callback? But, if I use their id explicitly, the only way I can come up with now is to use a global list…

4

you don’t know what code to write inside your “do_something” callback, or you want to replace your global variable ?

if you want to replace your global variable, the only way you can do it with Dash for the moment is to “hard-code” a high number of list (in some_list) for the callback to be created at page load…

5

What i want to do is to get each of the slider values, say upon page load, I have 2 sliders, I want to have a way to get their value in the form of {‘slider1’:value1, ‘slider2’:value2} and put it in a hidden div, so plots of the page can access those slider value. I can create a global hidden div to store the sliders name and id, but then how to write a callback function to get their value is what get me stuck.

6

Hey @chainster_mike,
were you able to find a solution to this?
I’m coming across a similar hurdle