# Conditionally show field based on another field?

**URL:** <https://discourse.getcockpit.com/t/conditionally-show-field-based-on-another-field/859>\
**Category:** Feature Request\
**Created:** [June 9, 2019, 11:33pm UTC](https://discourse.getcockpit.com/t/conditionally-show-field-based-on-another-field/859 "2019-06-09T23:33:44Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![JoshuaJones](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.getcockpit.com/joshuajones/32/345_2.png) [@JoshuaJones](https://discourse.getcockpit.com/u/JoshuaJones)\
**Post date:** [June 9, 2019, 11:33pm UTC](https://discourse.getcockpit.com/t/conditionally-show-field-based-on-another-field/859/1 "2019-06-09T23:33:44Z")

</div>

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.

---

<div class="post-metadata">

**Author:** ![pauloamgomes](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.getcockpit.com/pauloamgomes/32/48_2.png) [@pauloamgomes](https://discourse.getcockpit.com/u/pauloamgomes)\
**Post date:** [June 10, 2019, 11:09pm UTC](https://discourse.getcockpit.com/t/conditionally-show-field-based-on-another-field/859/2 "2019-06-10T23:09:07Z")

</div>

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](https://monosnap.com/file/CMRemkOeYVig78VlZbbu957kBmOl7y)

```json
{
  "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"
          }
        ]
      }
    }
  ]
}

```

---

<div class="post-metadata">

**Author:** ![JoshuaJones](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.getcockpit.com/joshuajones/32/345_2.png) [@JoshuaJones](https://discourse.getcockpit.com/u/JoshuaJones)\
**Post date:** [June 11, 2019, 3:55pm UTC](https://discourse.getcockpit.com/t/conditionally-show-field-based-on-another-field/859/3 "2019-06-11T15:55:59Z")

</div>

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

---

<div class="post-metadata">

**Author:** ![artur](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.getcockpit.com/artur/32/4_2.png) [@artur](https://discourse.getcockpit.com/u/artur)\
**Post date:** [June 11, 2019, 10:58pm UTC](https://discourse.getcockpit.com/t/conditionally-show-field-based-on-another-field/859/4 "2019-06-11T22:58:34Z")

</div>

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

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

```

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

---

<div class="post-metadata">

**Author:** ![gnagnu](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.getcockpit.com/gnagnu/32/572_2.png) [@gnagnu](https://discourse.getcockpit.com/u/gnagnu)\
**Post date:** [July 27, 2020, 10:01am UTC](https://discourse.getcockpit.com/t/conditionally-show-field-based-on-another-field/859/5 "2020-07-27T10:01:51Z")

</div>

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'"
    }
  }]
}
```

---

<div class="post-metadata">

**Author:** ![artur](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.getcockpit.com/artur/32/4_2.png) [@artur](https://discourse.getcockpit.com/u/artur)\
**Post date:** [August 3, 2020, 11:21am UTC](https://discourse.getcockpit.com/t/conditionally-show-field-based-on-another-field/859/6 "2020-08-03T11:21:44Z")

</div>

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

---

<div class="post-metadata">

**Author:** ![tapmeppe](https://yyz2.discourse-cdn.com/flex030/user_avatar/discourse.getcockpit.com/tapmeppe/32/1150_2.png) [@tapmeppe](https://discourse.getcockpit.com/u/tapmeppe)\
**Post date:** [August 20, 2022, 2:33pm UTC](https://discourse.getcockpit.com/t/conditionally-show-field-based-on-another-field/859/7 "2022-08-20T14:33:00Z")

</div>

> [@artur](#):
>
> @visibility

Is this still working in the current version (v2.2.1). I tried on a text field, placing the line in the options field and even the meta \> condition field with no success.  
Can you provide an example of the whole options field?