decaporg / decaporg/decap-cms

dependent fields in collection

Open
#565 24 comments 102 reactions 1 assignee Claimed by @barthc View on GitHub
area: extensions/widgets kind: experimental pinned status: needs design
Dominant language
JavaScript
Stars
19.4k
Forks
3.1k
Avg merge
1d 14h
Merged PRs (30d)
9

Description

hey,

i could not find any information about this therefor i thought i would ask here.

is it possible to show and hide fields depending on some other field?

eg. this is my frontmatter
```
---
...
structure:
- type: productCircle
- type: divider
- type: copy
content:
text: >-
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Fugiat fugit enim quo consequuntur amet quasi ullam officia assumenda nihil. Corrupti delectus magnam excepturi nobis quae nihil explicabo provident repellat quaerat.
- type: infographic
content:
src: http://example.com/text.png
overlay: http://example.com/text.png
- type: divider
- type: copy
content:
text: >-
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Animi nihil error repellendus perspiciatis ratione, dolores, cum dicta sapiente quod labore saepe, quam ab placeat veniam nobis culpa totam vitae nam.
- type: infographic
content:
src: http://example.com/text.png
overlay: http://example.com/text.png
- type: copy
content:
text: >-
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aspernatur vero, quos velit minima placeat alias, quibusdam at sed quia illum dolorum. A, rem aut quidem excepturi aliquam. Aliquid, ea, cumque.
- type: quote
variant:
- with-divider
content:
items:
- image: http://example.com/text.png
copy: Lorem ipsum dolor sit amet, consectetur adipisicing elit. Vitae sunt, earum? Perferendis ab blanditiis ut sequi consequuntur repudiandae ad ratione, amet eligendi laborum itaque labore, eius. Illo, quidem tempore quam!
author: Mario and Luigi
type: light
- type: divider
- type: copy
content:
text: >-
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deleniti, illum qui. Adipisci fugit, obcaecati, vel nostrum cumque a dignissimos odit eveniet ab. Aut cum officiis nesciunt necessitatibus, provident, ullam delectus!
- type: image
content:
src: http://example.com/text.png
---
```

based on that type different configurations for this list item might be needed

eg.
if my type is `image` only a `image` field is necessary but if the type is `infographic`and additional overlay `image` can be added

my `config.yml` looks like this

```
- label: 'structure'
name: structure
widget: 'list'
fields:
- {label: "type", name: "type", widget: "select", options: ["copy", "divider", "image", "infographic", "productCircle", "quote"]}
- label: content
name: content
widget: object
fields:
- {label: 'text', name: 'text', widget: 'markdown'}
- {label: 'src', name: 'src', widget: 'image'}
- {label: 'overlay', name: 'overlay', widget: 'image'}
```

this list has a lot of unused options and i am far from done adding all the fields

what would a good way to implement this kind of structure?

cms version 0.4.6

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.