How to handle a boolean state in a clientside_callback?

Dash Python
1

I have a boolean value from a radio_item with the id ‘dimension’. I want to use this value as a State in a clientside callback. The callback currently looks like this:

app.clientside_callback(
    """
    function(fig) {
        const x_range = fig.layout.xaxis.range;
        const y_range = fig.layout.yaxis.range;
        return JSON.stringify([x_range, y_range])
    }
    """,
    Output('limits', 'children'),
    Input('main-plot', 'figure'),
    prevent_initial_call=True
)

I want it to become something like this:

app.clientside_callback(
    """
    function(fig, dim) {
        if dim {
                return window.dash_clientside.no_update
        } else {
                const x_range = fig.layout.xaxis.range;
                const y_range = fig.layout.yaxis.range;
                return JSON.stringify([x_range, y_range])
        }
    }
    """,
    Output('limits', 'children'),
    Input('main-plot', 'figure'),
    State('dimension', 'value'), # this a boolean
    prevent_initial_call=True
)

Many thanks.

2

Hello @am1234,

For JS if statements, you have to wrap them like this if (condition) {}, so:

app.clientside_callback(
    """
    function(fig, dim) {
        if (dim) {
                return window.dash_clientside.no_update
        } else {
                const x_range = fig.layout.xaxis.range;
                const y_range = fig.layout.yaxis.range;
                return JSON.stringify([x_range, y_range])
        }
    }
    """,
    Output('limits', 'children'),
    Input('main-plot', 'figure'),
    State('dimension', 'value'), # this a boolean
    prevent_initial_call=True
1 Like