Dynamically created button triggers callback with n_clicks value = None

Dash Python
1

I noticed that when I dynamically create buttons they trigger callback with n_clicks value = None. Here screenshot of a sample app, which was just launched and the set_text callback was triggered:

image
image714×146 3.22 KB

Same thing every time the “Recreate Button” is clicked - which triggers a callback that re-creates the first button and re-creation triggers a set_text callback again.

Here code:

from dash import Dash
import dash
from dash import html
from dash.dependencies import Input, Output
import dash_bootstrap_components as dbc
from dash import html
import datetime


dropdown = dbc.Button("Button", id='button1')

app = Dash(__name__, external_stylesheets=[dbc.themes.BOOTSTRAP])

app.layout = html.Div([html.Div(id="html_div0"),
              html.Div(id="html_div1"),
              dbc.Button("Recreate Button", id='recreate_button')])

@app.callback(
        Output('html_div1', 'children'),
        Input('button1', 'n_clicks'),
        prevent_initial_call=True,
    )
def set_text(_):
    return [f"triggered {datetime.datetime.now()} {dash.ctx.triggered}"]

@app.callback(
        Output('html_div0', 'children'),
        Input('recreate_button', 'n_clicks'),
    )
def button_setter(_):
    return dropdown

if __name__ == "__main__":
    app.run_server(debug=True, use_reloader=False, port=2000)

I know it can be handled by checking the value, but if possible I would rather avoid having it trigger callbacks at all in this case.

2

Hi,

I don’t think you can prevent the callback to be triggered otherwise, as the callback is triggered because you are adding the component to the layout in both cases.

3

No worries, thanks @jlfsjunior