# Dash Callback inside a Function

**URL:** <https://community.plotly.com/t/dash-callback-inside-a-function/42772>\
**Category:** Dash Python\
**Created:** [July 21, 2020, 6:20pm UTC](https://community.plotly.com/t/dash-callback-inside-a-function/42772 "2020-07-21T18:20:48Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![aasghari](https://avatars.discourse-cdn.com/v4/letter/a/c68b51/32.png) [@aasghari](https://community.plotly.com/u/aasghari)\
**Post date:** [July 21, 2020, 6:20pm UTC](https://community.plotly.com/t/dash-callback-inside-a-function/42772/1 "2020-07-21T18:20:48Z")

</div>

Hello. I would like to use @app.callback in a function that is in another file than the main dashboard file. This function is called in main dashboard file and returns html.Div(), and I would like to use callback for a property within that Div. The code looks like below:

**Dashboard.py**

```auto
from function_process import function_process

external_stylesheets = ['https://codepen.io/chriddyp/pen/bWLwgP.css']
app = dash.Dash( __name__ , external_stylesheets = external_stylesheets)

app.layout = function_process()

```

**function\_process.py**

```auto
def function_process():

return html.Div(children=[
      dcc.Tabs(id='selected_tab', children=[
            dcc.Tab(....)
            dcc.Tab(....)
            dcc.Tab(....)
      ])
      html.Div(id='content_tab_selected')
      ])

```

I would like to write a callback within function\_process.py to return specific content to ‘content\_tab\_selected’ based on the tab choice in ‘selected\_tab’. Where should I place the @app.callback for this purpose?

---

<div class="post-metadata">

**Author:** ![fohrloop](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/fohrloop/32/24888_2.png) [@fohrloop](https://community.plotly.com/u/fohrloop)\
**Post date:** [July 22, 2020, 5:21am UTC](https://community.plotly.com/t/dash-callback-inside-a-function/42772/2 "2020-07-22T05:21:33Z")

</div>

Technically, it doesn’t really matter at all where you put your `@app.callback`s. In practice, I would put them where it makes logically sense, probably in the same file or folder as the element that may trigger the callback.

If you want to put the callbacks into separate files, make sure that creating the `app` instance and starting the server are in separate files (to prevent circular dependencies). For example

```auto
# app.py
app = dash.Dash( __name__ )

```

```python
# index.py
app.run_server()

```

Using the filenames as above, you would `import app from app` in the files that define the callbacks, and then, instead of running

```auto
python app.py

```

to start the server, you would run

```auto
python index.py

```

to start it.

---

<div class="post-metadata">

**Author:** ![fohrloop](https://sea2.discourse-cdn.com/flex024/user_avatar/community.plotly.com/fohrloop/32/24888_2.png) [@fohrloop](https://community.plotly.com/u/fohrloop)\
**Post date:** [July 22, 2020, 6:02am UTC](https://community.plotly.com/t/dash-callback-inside-a-function/42772/3 "2020-07-22T06:02:57Z")

</div>

Oops, I think I misread the question somehow. Callbacks in dash are little bit special. They are not regular python functions, but instead (I _assume_) `@app.callback` is syntactic sugar to make dash to create _Javascript_ code out of your python code. This is the reason why [All Callbacks must be defined before server starts](https://dash.plotly.com/callback-gotchas).

To define a [callback](https://dash.plotly.com/basic-callbacks) that returns something into `content_tab_selected` when you change `value` property of the [`dcc.Tabs`](https://dash.plotly.com/dash-core-components/tabs) `selected_tab`, you would use something like

```python
@app.callback(
    Output('content_tab_selected', 'children'),
    [Input('selected_tab', 'value')]
)
def this_name_can_be_anything_descriptive():
    
    return html.Div('abc')

```