JSON schema conditional within array based on "oneOf" selection

364 views Asked by At

I'd like to to display a form field based on a selection within an array to be able to dynamically add items based on selection.

What works:

Without array wrapped around this works. See code below:

{
      "schema": {
        "type": "object",
        "properties": {
                "accessory": {
                  "title": "Type",
                  "type": "string",
                  "default": "one",
                  "oneOf": [
                    { "title": "First", "enum": ["one"] },
                    { "title": "Second", "enum": ["two"] }
                  ],
                  "required": true
                },
                "setName": {
                  "type": "string"
                },
                "Second Name": {
                  "type": "string",
                  "description": "Only displayed if 'two' is selected",
                  "condition": {
                      "functionBody": "return model.accessory === 'two';"
                  }
                
              
            }
          }
        
      }
    }

What does not work:

But as soon as I wrap an array around it the condition is not working anymore.

{
  "schema": {
    "type": "object",
    "properties": {
      "accessories": {
        "title": "Accessories",
        "type": "array",
        "items": {
          "title": "Accessory",
          "type": "object",
          "properties": {
            "accessory": {
              "title": "Type",
              "type": "string",
              "default": "one",
              "oneOf": [
                { "title": "First", "enum": ["one"] },
                { "title": "Second", "enum": ["two"] }
              ],
              "required": true
            },
            "setName": {
              "type": "string"
            },
            "Second Name": {
              "type": "string",
              "description": "Only displayed if 'two' is selected",
              "condition": {
                  "functionBody": "return model.accessory === 'two';"
              }
            }
          }
        }
      }
    }
  }
}

I've also tried the following conditions:

"return model[arrayIndex].accessory === 'two';"

and

"return ['two'].includes(model.accessory);"

1

There are 1 answers

0
panic On

This one works:

"Second Name": {
    "type": "string",
    "description": "Only displayed if 'two' is selected",
    "condition": "model.accessories[arrayIndex].accessory=='two'"
}