CODEWITHSUNDEEP
python-3.xplotlyplotly-dash
dejanualex
dejanualex

Reputation: 4358

Python Dash , get value from Input text

I have an input and a button, I need to save the value of the text input when the button is pressed .

dcc.Input(id='username', value='Initial Value', type='text'),

html.Button(id='submit-button', children='Submit'),

I am missing something from my callback? 

@app.callback(Output('output_div','children' ),
          [Input('submit-button')],
          [State('input-element', 'value')],
          [Event('submit-button', 'click'])

 def update_output(input_element):
    print(input_element)

Thanks

Upvotes: 3

Views: 23900

Answers (2)

Luca Ziegler
Luca Ziegler

Reputation: 4164

I got that working with Input callbacks:

app = JupyterDash(__name__)

app.layout = dash.html.Div(
    [
        dash.html.Div(
            [
                dcc.Input(
                    id="inp_start",
                    placeholder="Start (dd.MM.yyyy HH:mm)",
                    style={"width": "180px"},
                ),
                dcc.Input(
                    id="inp_end",
                    placeholder="Ende (dd.MM.yyyy HH:mm)",
                    style={"width": "180px"},
                ),
                dash.html.Button("Go", id="bt-go", n_clicks=0),
            ],
            style={"display": "flex"},
        ),
        dash.html.Div(id="content"),
    ],
    style={"display": "flex", "flex-direction": "column"},
)

@app.callback(
    Output("content", "children"),
    Input("bt-go", "n_clicks"),
    [Input("inp_start", "value"), Input("inp_end", "value")],
)
def update_output(n_clicks, start_value, end_value):
    fig = execute()
    return dash.dcc.Graph(
        id="fig", figure=fig, responsive=True, style={"width": "90vh", "height": "90vh"}
    )

Upvotes: 0

PieCot
PieCot

Reputation: 3639

Minimal working example:

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

if __name__ == '__main__':
    app = dash.Dash()

    app.layout = html.Div([
        dcc.Input(id='username', value='Initial Value', type='text'),
        html.Button(id='submit-button', type='submit', children='Submit'),
        html.Div(id='output_div')
    ])

    @app.callback(Output('output_div', 'children'),
                  [Input('submit-button', 'n_clicks')],
                  [State('username', 'value')],
                  )
    def update_output(clicks, input_value):
        if clicks is not None:
            print(clicks, input_value)

    app.run_server(host='0.0.0.0')

For further information, you can take a look to this answer or this one. If you are interested in handling enter event also, you can find some useful hints in this thread.

Upvotes: 6

Related Questions