Combinators Example

oneOf

Demo

Street Address *

City *

State *

Schema

schema.json

{
  "definitions": {
    "address": {
      "type": "object",
      "title": "Address",
      "properties": {
        "street_address": {
          "type": "string"
        },
        "city": {
          "type": "string"
        },
        "state": {
          "type": "string"
        }
      },
      "required": [
        "street_address",
        "city",
        "state"
      ]
    },
    "user": {
      "type": "object",
      "title": "User",
      "properties": {
        "name": {
          "type": "string"
        },
        "mail": {
          "type": "string"
        }
      },
      "required": [
        "name",
        "mail"
      ]
    }
  },
  "type": "object",
  "properties": {
    "addressOrUser": {
      "oneOf": [
        {
          "$ref": "#/definitions/address"
        },
        {
          "$ref": "#/definitions/user"
        }
      ]
    }
  }
}

UI Schema

uischema.json

{
  "type": "VerticalLayout",
  "elements": [
    {
      "type": "Control",
      "label": "Basic Information",
      "scope": "#/properties/addressOrUser"
    }
  ]
}

Data

{
  "addressOrUser": {
    "street_address": "1600 Pennsylvania Avenue NW",
    "city": "Washington",
    "state": "DC"
  }
}

anyOf

Demo

Street Address *

City *

State *

Schema

schema.json

{
  "definitions": {
    "address": {
      "type": "object",
      "title": "Address",
      "properties": {
        "street_address": {
          "type": "string"
        },
        "city": {
          "type": "string"
        },
        "state": {
          "type": "string"
        }
      },
      "required": [
        "street_address",
        "city",
        "state"
      ]
    },
    "user": {
      "type": "object",
      "title": "User",
      "properties": {
        "name": {
          "type": "string"
        },
        "mail": {
          "type": "string"
        }
      },
      "required": [
        "name",
        "mail"
      ]
    }
  },
  "type": "object",
  "properties": {
    "addressOrUser": {
      "anyOf": [
        {
          "$ref": "#/definitions/address"
        },
        {
          "$ref": "#/definitions/user"
        }
      ]
    }
  }
}

UI Schema

uischema.json

{
  "type": "VerticalLayout",
  "elements": [
    {
      "type": "Control",
      "label": "Basic Information",
      "scope": "#/properties/addressOrUser"
    }
  ]
}

Data

{
  "addressOrUser": {
    "street_address": "1600 Pennsylvania Avenue NW",
    "city": "Washington",
    "state": "DC"
  }
}

allOf

Demo

Street Address *

City *

State *

Name *

is a required property

Mail *

is a required property

Schema

schema.json

{
  "definitions": {
    "address": {
      "type": "object",
      "title": "Address",
      "properties": {
        "street_address": {
          "type": "string"
        },
        "city": {
          "type": "string"
        },
        "state": {
          "type": "string"
        }
      },
      "required": [
        "street_address",
        "city",
        "state"
      ]
    },
    "user": {
      "type": "object",
      "title": "User",
      "properties": {
        "name": {
          "type": "string"
        },
        "mail": {
          "type": "string"
        }
      },
      "required": [
        "name",
        "mail"
      ]
    }
  },
  "type": "object",
  "properties": {
    "addressOrUser": {
      "allOf": [
        {
          "$ref": "#/definitions/address"
        },
        {
          "$ref": "#/definitions/user"
        }
      ]
    }
  }
}

UI Schema

uischema.json

{
  "type": "VerticalLayout",
  "elements": [
    {
      "type": "Control",
      "label": "Basic Information",
      "scope": "#/properties/addressOrUser"
    }
  ]
}

Data

{
  "addressOrUser": {
    "street_address": "1600 Pennsylvania Avenue NW",
    "city": "Washington",
    "state": "DC"
  }
}