重组:使用容器打开模态的操作按钮
Retool: Action button to open modal with container
我有一个 table 正在重组。我添加了带有按钮的 "action" 列并将它们重命名为 "edit"。单击操作按钮我想做的是打开一个模式,其中填充了行中的数据。用户应该能够看到行的值,编辑它们,当他单击 "submit" 时,它将发送更新 API 调用以获取该行的唯一 ID。
我们正在为模态组件编写一些新文档,但在此之前,您可以执行以下操作:
- 将模态组件拖到 canvas 上。它将显示为一个打开模型的按钮,但暂时不要担心
- 在打开模式的查询编辑器中创建一个 Javascript 查询。如果我们使用默认名称,您的查询将是
modal1.open()
- 将 table 中的操作按钮配置为 运行 JS 在点击时查询
这是通过操作按钮打开模式的快捷方式。就该模态中的内容而言,您可以拖动任何所需的组件并引用 table 属性。因此,如果您想显示用户的电子邮件,您可以将文本组件拖到模型中并将其值设置为 table1.selectedRow.data.email
.
最后要处理的是按钮,您可能不需要它,因为您是通过操作按钮打开模式的。您可以通过单击它隐藏它,前往右侧栏中的检查器,然后向下滚动到“显示”设置。只需将 true
放入“为真时隐藏”字段,按钮将不会显示。
我有一个 table 正在重组。我添加了带有按钮的 "action" 列并将它们重命名为 "edit"。单击操作按钮我想做的是打开一个模式,其中填充了行中的数据。用户应该能够看到行的值,编辑它们,当他单击 "submit" 时,它将发送更新 API 调用以获取该行的唯一 ID。
我们正在为模态组件编写一些新文档,但在此之前,您可以执行以下操作:
- 将模态组件拖到 canvas 上。它将显示为一个打开模型的按钮,但暂时不要担心
- 在打开模式的查询编辑器中创建一个 Javascript 查询。如果我们使用默认名称,您的查询将是
modal1.open()
- 将 table 中的操作按钮配置为 运行 JS 在点击时查询
这是通过操作按钮打开模式的快捷方式。就该模态中的内容而言,您可以拖动任何所需的组件并引用 table 属性。因此,如果您想显示用户的电子邮件,您可以将文本组件拖到模型中并将其值设置为 table1.selectedRow.data.email
.
最后要处理的是按钮,您可能不需要它,因为您是通过操作按钮打开模式的。您可以通过单击它隐藏它,前往右侧栏中的检查器,然后向下滚动到“显示”设置。只需将 true
放入“为真时隐藏”字段,按钮将不会显示。