# Run Function/Program on Button Click

**URL:** <https://community.plotly.com/t/run-function-program-on-button-click/12632>\
**Category:** Dash Python\
**Created:** [August 10, 2018, 5:01pm UTC](https://community.plotly.com/t/run-function-program-on-button-click/12632 "2018-08-10T17:01:27Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![ryanoud](https://avatars.discourse-cdn.com/v4/letter/r/4da419/32.png) [@ryanoud](https://community.plotly.com/u/ryanoud)\
**Post date:** [August 10, 2018, 5:01pm UTC](https://community.plotly.com/t/run-function-program-on-button-click/12632/1 "2018-08-10T17:01:27Z")

</div>

Hello,

I am trying to use Dash to create an interactive dashboard that takes user input and then utilizes this input in a function. To better explain, I would like to provide users with a form in which they can input real estate information. Once they hit the submit button, I would like to utilize the user input as input for a function that will collect additional information on their real estate from the internet and other sources and then use this data to create graphs on other tabs of my dashboard.

I am having trouble understanding if this is even possible after a few hours of searching or how I would even do it.

Any help or direction would be greatly appreciated.

Thanks

---

<div class="post-metadata">

**Author:** ![Bachibouzouk](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/bachibouzouk/32/3594_2.png) [@Bachibouzouk](https://community.plotly.com/u/Bachibouzouk)\
**Post date:** [August 10, 2018, 5:06pm UTC](https://community.plotly.com/t/run-function-program-on-button-click/12632/2 "2018-08-10T17:06:38Z")

</div>

Hello,

The example for the `Button` component in the Dash core components page should contain a nice starter for what you described :  
[https://dash.plot.ly/dash-core-components/](https://dash.plot.ly/dash-core-components/)

For tutorials and quick start up about dash I would recommand [https://dash.plot.ly/](https://dash.plot.ly/)

---

<div class="post-metadata">

**Author:** ![ryanoud](https://avatars.discourse-cdn.com/v4/letter/r/4da419/32.png) [@ryanoud](https://community.plotly.com/u/ryanoud)\
**Post date:** [August 10, 2018, 5:28pm UTC](https://community.plotly.com/t/run-function-program-on-button-click/12632/3 "2018-08-10T17:28:19Z")

</div>

Thanks for the quick reply. This helps, but I am still quite confused on as to how I would initiate my other function (written in python) on the press of the button. For instance, I see how the button will take input and return an output, but it seems that that output needs to be already stored. What I am aiming to do is use the button to take the input, push that through to the function, run the function which will return output based on the input, and then I want to graph the returned data on another tab. Is this possible?

---

<div class="post-metadata">

**Author:** ![Bachibouzouk](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/bachibouzouk/32/3594_2.png) [@Bachibouzouk](https://community.plotly.com/u/Bachibouzouk)\
**Post date:** [August 13, 2018, 9:22am UTC](https://community.plotly.com/t/run-function-program-on-button-click/12632/4 "2018-08-13T09:22:00Z")

</div>

Hello,

could you provide me with your layout code? This will help me helping you 🙂

---

<div class="post-metadata">

**Author:** ![rajb\_1](https://avatars.discourse-cdn.com/v4/letter/r/ed8c4c/32.png) [@rajb\_1](https://community.plotly.com/u/rajb_1)\
**Post date:** [August 6, 2022, 1:22pm UTC](https://community.plotly.com/t/run-function-program-on-button-click/12632/5 "2022-08-06T13:22:06Z")

</div>

blast from the past but - did you ever find a way to make this work?

---

<div class="post-metadata">

**Author:** ![jhupiterz](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/jhupiterz/32/19435_2.png) [@jhupiterz](https://community.plotly.com/u/jhupiterz)\
**Post date:** [August 7, 2022, 1:08pm UTC](https://community.plotly.com/t/run-function-program-on-button-click/12632/6 "2022-08-07T13:08:31Z")

</div>

Hi @ryanoud, @rajb_1,

To achieve what you described, and if I understood correctly, you’ll need to make use of [callbacks](https://dash.plotly.com/basic-callbacks).

> _Dash_ apps are made interactive through _Dash Callbacks_

There are lots of examples of how to use callbacks in the [documentation](https://dash.plotly.com/basic-callbacks).  
Basically the structure of a callback looks like so:

```auto
@app.callback(Output(component_id, property_name),
              Input(component_id, property_name))
def function_to_create_output(input):
    ...
   return output

```

Then to combine the data collection part, one solution would be to feed the user input into an API for example that will then retrieve some data that you can store and use to build graphs. Might look like something like this (assuming that you’re making use of `dcc.Input` and `dcc.Store` components):

```auto
@app.callback(Output(component_id = 'data-storage', property_name = 'data'),
              Input(component_id = 'user-input', property_name = 'value'))
def fetch_data_from_user_input(input_value):
    # code to query an API
   return output_data

```

Hope that helps!