Learn how to use Dash Bio for next-gen sequencing & quality control. 🧬Register for the Oct 27 webinar.

Rangeslider in xaxis label not working

I have the following code snippet which is part of a function which is called on callback to update a graph plot :

layout = go.Layout(
                #title='X Weekly  ',
                showlegend=True,
                barmode = 'stack',
                boxmode = 'overlay',
                legend=dict(x=1.1, y=0,orientation="v"),
                xaxis={
                    'title':'Time Period : ' + radioTimeCLLNPS,
                    'rangeslider': {'visible': True}, 
                    'type': 'date'
                },
                
                yaxis={'title': dropDownCLLLine + ' CLL',
                        "tickformat" : '.0%',
                        'range' : [0,1]
                },
                
                margin=go.layout.Margin(l=90, r=0, t=20, b=20)
            )    

Now I wanted to also add a callback with the time selection based on the the range selected as Here so I tried to add an id to the rangeslider like this :

layout = go.Layout(
                #title='VENCLEXTA Weekly NPS(SP+SD) ',
                showlegend=True,
                barmode = 'stack',
                boxmode = 'overlay',
                legend=dict(x=1.1, y=0,orientation="v"),
                xaxis={
                    'title':'Time Period : ' + radioTimeCLLNPS,
                    'rangeslider': {'id':'Claims_RangeSlider', 'visible': True}, 
                    'type': 'date'
                },
                
                yaxis={'title': dropDownCLLLine + ' CLL NPS',
                        "tickformat" : '.0%',
                        'range' : [0,1]
                },
                
                margin=go.layout.Margin(l=90, r=0, t=20, b=20)
            )

but unfortunately after doing this, my graph doesn’t get updated with the figure at all even though there is no exception. Is there any issue with how I’m defining my id?

If I understand correctly you are defining the range slider within the layout of your graph?
I am not sure if that is possible, but how I made it working is to define the range slider in the layout of the app,
get a callback like
return dcc.Slider(
id=‘Claims_RangeSlider’,
min=0,
max=10,
step=1,
value=0,
marks={0:‘0’,
5:‘5’,
10:‘10’})
Then I have a callback with [Input(‘Claims_RangeSlider’, ‘value’)], which is then used in the function to filter the data, which is then used as the input of the plot function

I am not sure if this is exactly the same thing as you want to do, but that should make the slider work.