条件组件

The Conditional tab in the Form Designer allows you to place conditions on components in your form, in order to hide or display them.

“条件” 选项卡包含两个部分：

• Simple
• 高级条件

简单条件

“条件”选项卡的“简单”部分允许您根据另一个组件的值隐藏或显示某个组件。

“简单”部分包含三个字段：

1. This component should Display - from this dropdown list, choose:

   • True if you want to condition when the component displays.
   • False if you want to condition when the component hides.

2. When the form component - from this dropdown list, choose a component in the form to act as a condition.

3. Has the value - type in the value that conditions the component when to display or hide.

   

高级条件

“高级条件” 部分允许您使用 JavaScript 代码来组合条件。

高级逻辑将覆盖简单条件逻辑的结果。

在“JavaScript 代码” 部分中，输入自定义 JavaScript 代码。

The show variable must be given a true or false value. The data variable is used to access other components in the form, through the API key.

教程

简单条件

要配置简单条件逻辑，请执行以下操作：

1. Open the Form Designer in the Create Form activity.
2. 将组件拖放到表单中。 在此示例中，拖放以下内容：
   1. 两个复选框组件。
   2. 一个数字组件。
   3. 一个文本字段组件。请注意每个组件的字段键。您需要它们来创建条件逻辑。
3. Navigate to the Conditional tab of the Text Field component and go to the Simple section.
   1. 应从下拉列表中为“显示 -”组件选择“True” 。这将创建显示“文本字段” 组件的条件。如果要隐藏组件，请选择“False” 。
   2. 如果使用表单组件，则从下拉列表中选择“数字”组件。
   3. 具有值- 键入限制要显示的文本字段的“数字”组件的值。
4. 保存组件。

高级条件

要配置高级条件逻辑，请执行以下操作：

1. Open the Form Designer in the Create Form activity.

2. 将组件拖放到表单中。 在此示例中，拖放以下内容：

   1. 两个复选框组件。
   2. 一个数字组件。
   3. 一个文本字段组件。请注意每个组件的字段键。您需要它们来创建条件逻辑。

3. Navigate to the Conditional tab of the Number component.

4. Click Advanced Conditions and go to the JavaScript section.

5. 如果要创建条件，请使用show变量，并使用等号=为其分配条件。使用data.field_key_component变量访问其他表单组件中的数据。在此示例中，要显示“数字”组件，您可以输入以下脚本：

   show = (data.checkbox1 === true && data.checkbox === true)
   

   如果要隐藏某个条件下的组件，请在等号 = 之后和条件之前放置一个感叹号 ! 。

6. For this example, to hide the Number component, you can type in this script:

   show = !(data.checkbox1 === true && data.checkbox === true)
   

7. 保存组件。

示例工作流

要查看完整的工作流或供日后参考，请下载XAML 示例