FormSanity Demos

Hidden Mode

The default irrelevance mode removes a field from the layout entirely — its row is hidden and its controls are disabled.

Disabled Mode

data-fs-irrelevant="disabled" keeps a field in the layout but dims it instead of hiding it — for when seeing the field carries information. Here the dimmed shipping address mirrors billing as you type, showing exactly what will be used; uncheck to edit it independently.

  • Shipping
Relevant When Valid

valid(account-password) keeps the confirm field disabled until the password is answered and valid, and data-fs-clear-on-change wipes a stale confirmation whenever the password changes.

Compound Expression

One expression models the whole rule: a work trip always needs a visa; otherwise only non-citizens staying past 90 days do. Parentheses, ||, &&, and a numeric comparison across three fields of three control types.

  • Purpose
Container Relevance

data-fs-relevant on a container governs every field inside it with one expression; on an element holding no fields at all, it simply shows and hides content.

  • Pay by

Nothing to fill in now — we will email an invoice after checkout.

Member Relevance

data-fs-relevant on one member of a choice group governs that member alone. The group reads its relevant members only. A checked member that goes irrelevant stops counting, and it counts again when its condition returns.

  • Member type
  • Journal subscription
  • Directory shows

An option takes the attribute too. The engine removes an irrelevant option from its list and puts it back in document order when it returns. In disabled mode, two members of one set can exclude each other.

  • Facility roles