# Python can't get value updated by clientside\_callback

**URL:** <https://community.plotly.com/t/python-cant-get-value-updated-by-clientside-callback/79985>\
**Category:** Dash Python\
**Created:** [November 9, 2023, 8:28am UTC](https://community.plotly.com/t/python-cant-get-value-updated-by-clientside-callback/79985 "2023-11-09T08:28:05Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![EchoVoice](https://avatars.discourse-cdn.com/v4/letter/e/43a26b/32.png) [@EchoVoice](https://community.plotly.com/u/EchoVoice)\
**Post date:** [November 9, 2023, 8:28am UTC](https://community.plotly.com/t/python-cant-get-value-updated-by-clientside-callback/79985/1 "2023-11-09T08:28:05Z")

</div>

I have code as below:

```auto
from dash import Dash, html, dcc, Input, Output, State, no_update, clientside_callback

app = Dash(
    name= __name__ , 
)

app.layout= html.Div([
    html.Button("click1", id="button1"),
    html.Button("click2", id="button2"),
    dcc.Input(id="input1"),
    html.Div(id="echo"),
    html.Div(id="echo2"),
])

clientside_callback(
    '''
    function (x){
        document.getElementById('input1').value="test";
        return ""
    }
    ''',
    Output("echo", "children"),
    Input("button1", "n_clicks"),
    prevent_initial_call = True,
)

@app.callback(
    Output("echo2", "children"),
    Input("button2", "n_clicks"),
    State("input1", "value"),
    prevent_initial_call = True,
)
def PrintInput(x, value):
    if x is None:
        return None
    return str(value)

server = app.server
if __name__ == " __main__":
    app.run_server(
        debug=True,
        port=8050
    )

```

What I want to do is user can click button1 to set value to input1 via a clientside\_callback. This was simulation of user barcode scanning so I think I can’t make it through normal callback. Then I want to use the value of input1 set before, which is clicking button2 to show in echo2 here. But by this way I can’t get value of input1 in python. How to improve the code to get it? Thanks very much for your help.

---

<div class="post-metadata">

**Author:** ![valsorim](https://avatars.discourse-cdn.com/v4/letter/v/e47774/32.png) [@valsorim](https://community.plotly.com/u/valsorim)\
**Post date:** [November 9, 2023, 9:19am UTC](https://community.plotly.com/t/python-cant-get-value-updated-by-clientside-callback/79985/2 "2023-11-09T09:19:14Z")

</div>

You are returning an empty string in the JavaScript function.

You can use `State` of `input1` like this:

```python
from dash import Dash, html, dcc, Input, Output, State, no_update, clientside_callback

app = Dash(
    name= __name__ , 
)

app.layout= html.Div([
    html.Button("click1", id="button1"),
    html.Button("click2", id="button2"),
    dcc.Input(id="input1"),
    html.Div(id="echo"),
    html.Div(id="echo2"),
])

clientside_callback(
    '''
    function (n_clicks, value){
        return value
    }
    ''',
    Output("echo", "children"),
    Input("button1", "n_clicks"),
    State("input1", "value"),
    prevent_initial_call = True,
)

@app.callback(
    Output("echo2", "children"),
    Input("button2", "n_clicks"),
    State("input1", "value"),
    prevent_initial_call = True,
)
def PrintInput(x, value):
    if x is None:
        return None
    return str(value)

server = app.server
if __name__ == " __main__":
    app.run_server(
        debug=True,
        port=8050
    )

```

or modify the javascript function:

```auto
from dash import Dash, html, dcc, Input, Output, State, no_update, clientside_callback

app = Dash(
    name= __name__ , 
)

app.layout= html.Div([
    html.Button("click1", id="button1"),
    html.Button("click2", id="button2"),
    dcc.Input(id="input1"),
    html.Div(id="echo"),
    html.Div(id="echo2"),
])

clientside_callback(
    '''
    function (x){
        return document.getElementById('input1').value;
    }
    ''',
    Output("echo", "children"),
    Input("button1", "n_clicks"),
    prevent_initial_call = True,
)

@app.callback(
    Output("echo2", "children"),
    Input("button2", "n_clicks"),
    State("input1", "value"),
    prevent_initial_call = True,
)
def PrintInput(x, value):
    if x is None:
        return None
    return str(value)

server = app.server
if __name__ == " __main__":
    app.run_server(
        debug=True,
        port=8050
    )

```

---

<div class="post-metadata">

**Author:** ![AIMPED](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/aimped/32/21758_2.png) [@AIMPED](https://community.plotly.com/u/AIMPED)\
**Post date:** [November 9, 2023, 10:38am UTC](https://community.plotly.com/t/python-cant-get-value-updated-by-clientside-callback/79985/3 "2023-11-09T10:38:20Z")

</div>

Wlecome to the forums, @EchoVoice

You could include the component `input1` as output here:

> [@EchoVoice](#):
>
> ```auto
> clientside_callback(
> '''
> function (x){
> return ["", "test"]
> }
> ''',
> Output("echo", "children"),
> Output("input1", "value"),
> Input("button1", "n_clicks"),
> prevent_initial_call = True,
> )
> 
> ```