Vertical Navigation Object Editor

Displays object properties with vertical navigation, suitable for tabbed interfaces within a fieldset.

Activation Conditions

  • "type": "object"
  • "x-format": "nav-vertical"

Options

  • "x-navWarning" — show a warning indicator on tabs that contain validation errors (defaults to true)
  • "x-navWarningMessage" — custom message shown in the tab warning indicator
  • "x-format": "nav-vertical-N" — use a custom column width for the tab list, where N is a Bootstrap column number (e.g. "nav-vertical-3")

Example

{
  "x-format": "nav-vertical",
  "type": "object",
  "title": "All Editors",
  "properties": {
    "personA": {
      "title": "Person A",
      "type": "object",
      "properties": {
        "name": {
          "type": "string"
        },
        "age": {
          "type": "integer",
          "minimum": 0
        }
      }
    },
    "personB": {
      "title": "Person B",
      "type": "object",
      "properties": {
        "name": {
          "type": "string"
        },
        "age": {
          "type": "integer",
          "minimum": 0
        }
      }
    }
  }
}