How to register the value change to dash?

[happyshows]

Hi,

I was attempting to use jquery to trigger an update to a div by registering a click event via a loop of buttons.

However, although the click works fine, and the div is updated correctly, it doesn't seem to get pick up by dash's callback function

for example: when user click the button, it'll trigger an update to the 'operation' div. I have another button called 'btn-test' which checks the value of 'operation' div, it doesn't seem to pick up the update, where am I missing here?

@dash_app.callback(
    Output('test', "style"),
    [
        Input('btn-test','n_clicks')
    ],
    [
        State('operation', "children"),
    ]
)
def test(_, id):
    print(id)
    return {}

[happyshows]

my js function

@dash_app.callback(
    Output(MOD_ID('js', 'delete_msg'), 'run'),
    [
        Input(MOD_ID('div', 'chatwindow'), 'children'),
    ]
)
def test(_):
    if not _:
        raise PreventUpdate
    js = """
    function hi(event){
        var id = $(this).closest("div").prop("id");
       $('#operation').html('del ' + id);
    }
    $('.messages').children('.message').on('click', '.btn-delete', hi);
    """
    return js

[jimmybow]

First, you have a special function, setProps, in your javascript. you need to use it to set the prop. of your visdcc.Run_js conponent, which will be used in your app.callback(). See https://github.com/jimmybow/visdcc/blob/master/example/Run_js/Add_event_and_callback.py#L52

Then, you just put your visdcc.Run_js conponent id and its prop. in your app.callback() to fire your action. See https://github.com/jimmybow/visdcc/blob/master/example/Run_js/Add_event_and_callback.py#L63

[happyshows]

Thanks it works