Clientside_callback is throwing an error when page opens but not once the page is refreshed

Dash Python
1

I asked this question on stackoverflow and a user pointed me to this forum.

I have a clientside_callback to get the width of the window whenever a dropdown value is changed:

app.clientside_callback(
    """
    function(a,b,c) {
        var w = window.innerWidth;
        return w;
    }
    """,
    Output('x_pixels', 'children'),
    Input('x', 'value'),
    Input('y', 'value'),
    Input('z', 'value'),
)

Which updates a html.Div:

html.Div([
        html.Div(id='x_pixels')
    ], style={'display': 'none'})

Which is throwing an error dc[namespace][function_name] is undefined. However, the strange thing is this doesn’t always happen, it happens only around 90% of the time, and once the browser window and dash app is refreshed, the error doesn’t appear when it has reloaded.

Any help greatly appreciated!

2

Hey @am1234 welcome to the forums.

try removing the the last comma, assuming this is the last line before closing the bracket of the clientside_callback()

I can’t reproduce this error (Dash 2.9.2), does the following show any error on your side?

import dash
from dash import Input, Output, html

app = dash.Dash(__name__)
app.layout = html.Div(
    [
        html.Div(
            [
                html.Button(btn, id=btn)
                for btn in 'xyz'
            ]
        ),
        html.Div(id='x_pixels')
    ]
)


app.clientside_callback(
    """
    function(a,b,c) {
        var w = window.innerWidth;
        return w;
    }
    """,
    Output('x_pixels', 'children'),
    Input('x', 'n_clicks'),
    Input('y', 'n_clicks'),
    Input('z', 'n_clicks'),
    prevent_initial_call=True
)

mred cscb

3

Thanks so much. The solution was to remove the trailing comma.

1 Like