Limit dynamic zone component

System Information
  • Strapi Version: 3.3.2
  • Operating System: Docker-Ubuntu
  • Database: MySQL 8 / SQLite in dev
  • Node Version: 14.15.0
  • NPM Version: none
  • Yarn Version: latest

Hello, I’m working with the Dynamic Zones and have two types of them. I limit the components with the “min” and “max” attributes, but I need specificate the number of the type of Dynamic component to use in the Content-Manager.

Ex:

“answers”: {
“type”: “dynamiczone”,
“components”: [
“answer.image”,
“answer.text”
],
“required”: true,
“max”: 3,
“min”: 3
}

I need all the answers to be “image” or “text”.

How can I do?

Thanks!

If you select the first dynamic zone image, then you want to allow only images? Did I get it right?

Yes! Only “image” or “text” (any type of component).

As I see, you need exactly three of them.

In that case, limit the dynamic zone to min:1 and max:1 and add two more fields to each component like in the pictures below.

Image:
image

Text:
image

That way you can choose only one component, image OR text.

1 Like

Thanks!

One more thing, in this case, each component have a boolean field and need to one of them to be true. How can I do?

Also, to achieve this more dynamically, like adding between 1-3 answers, you can use repeatable components instead of adding three fields.

Create component: image_wrapper, which will hold the repeatable components image_single. When you are adding image_single to image_wrapper you can also choose min and max.
image

image

That way you can add sometimes only 1 or 2 images instead of 3.

1 Like

By default, if you add Required to boolean, you won’t be able to save the document if you don’t set it to true(or set it back to false from true). As in this example, I’ve just added the component and I didn’t clicked on the boolean input. (as it has NULL value by default)


But you need a more “strict” validation then you need to verify it in the backend, inside the lifecycle beforeCreate and beforeUpdate

1 Like

Thanks!

Seems to works, but doesn’t show the error properly.

image