Conditionally show field based on another field?

The options docs for fields don’t make a reference to this, so I’m not sure if this is something already built into Cockpit.

Is there functionality already built into Cockpit that will conditionally show a field based on another field? For example, we create a collection of news items that can sometimes be external links. A boolean field in this collection called “external_link” is toggled on which then shows a hidden Text field for the url. When toggled off, the Text field is hidden.

2 Likes

No, that is not possible, unless you build your custom field or add some js in the middle.

But instead, why not build a repeater field combined with set, in way that you can choose the type of new item, e.g.:

https://monosnap.com/file/CMRemkOeYVig78VlZbbu957kBmOl7y

{
  "safeDelete": true,
  "fields": [
    {
      "type": "text",
      "label": "Simple Item"
    },
    {
      "type": "set",
      "label": "External Link",
      "options": {
        "fields": [
          {
            "type": "text",
            "label": "Text",
            "name": "text"
          },
          {
            "type": "text",
            "label": "Link",
            "name": "link"
          }
        ]
      }
    }
  ]
}
3 Likes

Beautiful solution! Thanks for the tip Paul, better approach than I’ve been going with

in the field options you can define a @visibility property, e.g:

"@visibility": "$.external_link === true"

This feature is experimental, that’s why it isn’t documented anywhere.
But feel free to try it out.

7 Likes

Hi @artur

Could this work within a set field? Either referencing a field in the set (example below) or a top-level field in the entry. Thanks

Hang

{
  "fields": [{
    "name": "first_name",
    "type": "text"
  }, {
    "name": "last_name",
    "info": "you need to provide your last name if you are John"
    "type": "text",
    "options": {
      "@visibility": "$.first_name === 'John'"
    }
  }]
}
1 Like

@gnagnu sorry, unfortunately this doesn’t work for nested fields

1 Like