Back to docs

Dependent form fields

Show or hide fields based on the value of another field. Keep forms clean and contextual without custom JavaScript.

How it works

A field can declare a dependsOn property that references another field by name. When the parent field matches a given value, the dependent field becomes visible.

Schema example

{
  "fields": [
    {
      "name": "payment_method",
      "type": "select",
      "options": ["card", "invoice"]
    },
    {
      "name": "po_number",
      "type": "text",
      "dependsOn": {
        "field": "payment_method",
        "value": "invoice"
      }
    }
  ]
}

The po_number field only renders when payment_method equals "invoice".

Multiple dependencies

Chain dependencies by having a dependent field serve as the parent for another. The engine resolves the visibility tree top-down on every change.

Validation behavior

Hidden fields are excluded from required-field validation. When a field becomes visible again, its validation rules re-engage immediately.