Dash应用点击submit按钮报ID not found in layout错误如何修复

问题根因 #

这是Dash多页面应用的典型回调校验报错，触发原因有2个：

1. 多页应用所有回调会在服务启动时全局注册，而初始全局布局仅包含路由容器，所有业务页面的组件都是路由切换后才动态加载的，Dash默认会校验所有回调绑定的ID是否存在于初始布局中，不存在就抛出该异常。
2. 你的回调输出目标alert7没有在对应页面的布局中定义，就算关闭校验，后续触发回调时也会报运行时错误。

修复方案 #

• 第一步：补全缺失的布局组件
  在你给出的业务页面controls组件末尾，新增ID为alert7的容器，示例修改如下：

html.Hr(),
    dbc.Button(
        id='submit_button_test',
        n_clicks=0,
        children='Submit',
        color='primary',
        block=True
        ),
    html.Hr(),
    html.Div(id="alert7"), # 新增该行，对应回调的输出目标
    html.Div(id="alert31"),
    html.Div(id="alert32"),
    html.Div(id="link7")

• 第二步：关闭回调异常校验（多页应用标准配置）
  找到全局初始化Dash实例的app.py文件，初始化时添加参数：

app = dash.Dash(__name__, suppress_callback_exceptions=True)

该配置就是报错提示中提到的专门适配多页应用/动态生成组件场景的参数，关闭服务启动时的全局ID校验，仅在回调实际触发时校验当前页面的ID是否存在。

• 第三步（可选）：确认回调所属页面匹配
  如果当前带submit_button_test的页面对应的是Quantity and Scrap业务，确认代码放在app3.py中，不要放在app7.py里，避免路由加载的布局和回调不匹配。

额外注意事项 #

你当前回调函数的参数databse拼写错误，和State里定义的database不一致，建议修正拼写避免后续参数取值错误。

内容的提问来源于stack exchange，提问作者DenisDev