How to apply composable condition in uischema?

Hi, can anyone help me understand how to apply composable conditions (type:“OR”/“AND”) in uischema?

[original thread by amsydennyK]

Hi @amsydennyk(amsydennyk), I would like to advise against using the deprecated composable conditions. You can just use the schema-based ones which are much more powerful, see our docs.

[amsydennyK]

Hi @sdirix(sdirix) (Stefan Dirix), thank you for the advise. So if I have to apply a set of conditions we can use oneOf/all of/anyOf within the schema right?

Yes exactly. You can use the full capabilities of JSON Schema validation.

[amsydennyK]

What if I need to apply conditions for two different scopes? For example :
I want to DISABLE a field only if selected “No” from an enum and also if the fields are empty.
How to implement this situation? Here the scopes are two different fields right?

I tried like:

“rule”:{
“effect”:“DISABLE”,
“allOf”:[
{
condition1
},
{
condition2
}
]

Is this approach correct? If not could you please suggest the right approach through an example?

When you want to cover multiple attributes, then you need to choose a scope which can cover both. Then within the schema field you need to specify a schema which will validate successfully whenever your effect shall apply.

JSON Schema:

{
  "type": "object",
  "properties": {
    "name": {
      "type": "string"
    },
    "yesOrNo": {
      "type": "string",
      "enum": [
        "yes",
        "no"
      ]
    }
  }
}

UI Schema:

{
  "type": "VerticalLayout",
  "elements": [
    {
      "type": "Control",
      "scope": "#/properties/name",
      "rule": {
        "effect": "DISABLE",
        "condition": {
          "scope": "#",
          "schema": {
            "allOf": [
              {
                "type": "object",
                "properties": {
                  "name": {
                    "const": ""
                  }
                }
              },
              {
                "type": "object",
                "properties": {
                  "yesOrNo": {
                    "const": "yes"
                  }
                },
                "required": [
                  "yesOrNo"
                ]
              }
            ]
          }
        }
      }
    },
    {
      "type": "Control",
      "scope": "#/properties/yesOrNo"
    }
  ]
}

The schema in the rule is scoped against the root object. It will validate successfully when

  • yesOrNo exists and is set to yes AND

  • name either doesn’t exist or is empty

Note that this is nothing special about JSON Forms and just regular JSON Schema validation.