如何通过将字段绑定到多个依赖关系来基于羊驼或条件显示相同的字段

时间:2017-12-08 10:45:44

标签: conditional html-form alpacajs

我正在使用alpacajs来呈现HTML表单。我的要求是根据复选框显示某些字段。我的表单中有三个复选框,如果选中任何复选框,我想显示一些字段。

我在conditional dependencies上浏览了羊驼文件,但无法找到解决问题的方法。我可以通过创建具有不同名称但相对于dry principle的相同字段来解决此问题。

我的代码如下所示。

"myCheckBox1": {
    "type": "boolean"
},
"myCheckBox2": {
    "type": "boolean"
},
"usernameField": {
    "label": "Username *",
    "order": 6,
    "type": "string"
    "disallowOnlyEmptySpaces": true,
    "showMessages": false,
    "disallowEmptySpaces": true,
}

如果选中myCheckBox1或myCheckBox2,我想显示usernameField。我改变了模式以显示条件依赖性。

"dependencies": {
  "usernameField": [
    "myCheckBox1"
  ],
  "usernameField": [
    "myCheckBox2"
  ]
}

但是只考虑最后给定的条件,即只有在检查myCheckBox2并且不考虑myCheckBox1时才会显示usernameField。我也试过下面的代码:

"dependencies": {
  "usernameField": [
    "myCheckBox1", "myCheckBox2"
  ]
}

但是评估为and condition。有没有办法使用不同的依赖关系显示相同的字段?

1 个答案:

答案 0 :(得分:2)

为什么不使用枚举类型的一组复选框,如下所示:

// schema
"check": {
    "title": "Select...",
    "type": "string",
    "enum": ["First", "Second"]
},
...
// options
"check": {
    "type": "checkbox"
}

然后你使用这样的条件依赖:

"username": {
   "dependencies": {
      "check": [
          'First', // if First is selected
          'Second', // if Second is selected
          'First,Second' // if both First and Second are selected
      ] 
   }
}

这是一个有效的fiddle

请告诉我这不是你想要的。