Interval component cannot be disabled via callback

Dash Python
1

Hi,
I’m trying a simple app with the checkbox that will enable/disable Interval timer.
Callback is changing ‘disabled’ property of a Interval and I expect that the timer stops when disabled is set to True, but that doesn’t happen - n_intervals keep ticking anyway. Does anyone know how to handle this? Is this expected behavior?
Code is below:

import dash
from dash.dependencies import Input, Output
import dash_core_components as dcc
import dash_html_components as html

refresh_interval = 2  # in seconds

app = dash.Dash(__name__)


def serve_layout():
    return html.Div(children=[
        html.Div(children=[
            dcc.Checklist(
                id='options',
                labelStyle={'display': 'inline-block'},
                className='choice-container',
                options=[
                    {'label': 'Auto Update', 'value': 'auto'}
                ],
                values=['auto']
            )
        ],
            style={'align': 'center'},
            className='twelve columns'
        ),
        html.Label('Timer counts:'),
        html.Div(id='debug'
                 # , style={'display': 'none'}
                 ),
        html.Label('Timer is disabled:'),
        html.Div(id='state'
                 # , style={'display': 'none'}
                 ),
        dcc.Interval(
            id='timer',
            interval=refresh_interval * 1000,  # in milliseconds
            disabled=False,
            n_intervals=0
        )
    ],
        className='container')


# put layout to a separate function so that the list of available coins is refreshed on page reload
app.layout = serve_layout


@app.callback(Output('timer', 'disabled'), [Input('options', 'values')])
def toggle_auto_update(options):
    return not ('auto' in options)


@app.callback(Output('debug', 'children'), [Input('timer', 'n_intervals')])
def update_value(n):
    return str(n)


@app.callback(Output('state', 'children'), [Input('timer', 'disabled')])
def update_value(n):
    return str(n)


# sample css sheet for Dash
app.css.append_css({'external_url': 'https://codepen.io/chriddyp/pen/bWLwgP.css'})

if __name__ == '__main__':
    app.run_server(debug=True, port=8050, host='0.0.0.0')
2

I think you can disable it by setting the max_intervals to 0.

3

You probably meant setting max_intervals to 0.
Yes, I just checked it and it worked, thanks!
But setting disabled to True would be more logical as for me

4

Looking at the code I see that the disabled prop is not actually used. I created an issue, PR’s are welcome.