Changing the value of a input from javascript callback does not trigger the callback associated with that input

Hi @mainul

Good timing! This is possible as of dash 2.16.1 by using dash_clientside_set_props
The docs aren’t available yet, but you use it like this:

dash_clientside.set_props(id, {props to set})
           

so in your case it would be:

dash_clientside.set_props("last-key-pressed", {value: event.key})

Here’s the whole callback


app.clientside_callback(
    """
    function(n_clicks) {
        document.addEventListener('keydown', function(event) {
            const allowedKeys = ['ArrowLeft', 'ArrowRight', 'Enter'];
            if (allowedKeys.includes(event.key)) {
                dash_clientside.set_props("last-key-pressed", {value: event.key})
            }
        });
        return window.dash_clientside.no_update;  // Return no_update if not an allowed key
    }
    """,
    Output('last-key-pressed', 'value'),
    [Input('invisible-button', 'n_clicks')],
)


4 Likes