Contentful logo

Contentful Community

Conditional Fields without rewriting them from scratch (which is difficult for a Reference Field)

Hi! I want to show/hide a Reference Field conditionally, say, depending on a select box above it.

I followed the tutorial and JSON-Editor based code sample but there the form is rewritten almost from scratch. Without reusing Contentful’s components (not only visual ones), we lose behaviors like:

  • active field highlight
  • embedded preview for Link fields
  • accessibility and possibly useful data attributes
  • native validation
  • creation/linking of entries for reference fields

Is it possible to make a Reference Field conditional without having to rewrite it from scratch? I see the Entity List presentation component in F36’s Storybook but is it possible to import and reuse also the logic to support it?

Here’s my experiment so far btw https://github.com/davilima6/contentful-ui-conditional-fields Maybe it serves as reference, specially src/renderWidget.js