Store Dash Input into a string variable

Dash Python
1

The example below is from the dash user guide. Here the user enters some text into 2 text boxes and clicks a submit bottom.

I’m new to all of this and don’t fully comprehend whats going on with callbacks, states etc.
I am trying to simply get the inputted text from the browser and store it in a string variable so I can work with it, Something like this:

x = str(input1) + " " + str(input2)

import dash
import dash_core_components as dcc
import dash_html_components as html
from dash.dependencies import Input, Output, State

external_stylesheets = [‘https://codepen.io/chriddyp/pen/bWLwgP.css’]

app = dash.Dash(name, external_stylesheets=external_stylesheets)

app.layout = html.Div([
dcc.Input(id=‘input-1-submit’, type=‘text’, value=‘Montréal’),
dcc.Input(id=‘input-2-submit’, type=‘text’, value=‘Canada’),
html.Div(id=‘output-submit’)
])

@app.callback(Output(‘output-submit’, ‘children’),
[Input(‘input-1-submit’, ‘n_submit’), Input(‘input-1-submit’, ‘n_blur’),
Input(‘input-2-submit’, ‘n_submit’), Input(‘input-2-submit’, ‘n_blur’)],
[State(‘input-1-submit’, ‘value’),
State(‘input-2-submit’, ‘value’)])
def update_output(ns1, nb1, ns2, nb2, input1, input2):
return u’’’
Input 1 is “{}”,
and Input 2 is “{}”
‘’’.format( input1, input2)

if name == ‘main’:
app.run_server(debug=True)

2

Hey… take a look at this.

2 Likes
3

Thank very much for the reply…your code is very clean and easy to understand.

But, what I fail to understand is, how to capture the text input and work with it later in the program. In your example, suppose I want to capture the name (variable x) and do some scrubbing on it after it’s captured from the input. Something like:

def update_output(clicked, input1, input2):
if clicked:
x = input1 + " " + input2
return x

name = update_output(clicked, input1, input2) <—How can I store user input in a variable like this?

name = name.upper() <-- So that I can work with it and do something

After the update_output is executed, I want to simply access the variable x and do something with it.

But this doesn’t work…I get a message saying “clicked, input1, and input2 are undefined”

Seems like I cannot access what the user inputs except from within the update_output function. I need/want to pass the user input to a string variable outside of the update_output function.

Thanks

1 Like
4

Assuming you want to manipulate the string in a callback:

-you can store the string for later use using this method discussed here.
https://dash.plot.ly/sharing-data-between-callbacks. i recommend using Example 1, sharing using div tags.

-then u retrieve the stored value whenever u want to use it. You will pass the div tag as an input to the callback function.

will share an example with you soon.

2 Likes
5

Thank you. I’ll see if I can follow the example.

6

Cdessy, an example here would be a great help. I’m too looking for a way to store str locally for later manipulation but couldn’t figure it out on my own from the documentation…