Solved

How to dynamically add components in your container component?

Forum|Forum|1 year ago
November 13, 2024
3 replies
1225 views

I have created a container component wherein i have a field in dialog which is a numberfield to set the number of childer components to be enabled.Is there a way that on number authored the children component can be added? As in if 2 is authored, i wanted two children components.

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.

Best answer by Tethich

There is a way to limit the multifield, but needs custom code. Many already did it:

https://aemhints.com/2020/10/24/limit-multifield-aem65/

https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/how-to-set-min-max-item-in...

As for adding dynamically those many children, it can be achieved by setting up initial content in your component template file.

Tethich

Community Advisor

Hi @pleben

Do you have any limitation that forbids you of using Granite Multifield ?

P

PlebenAuthor

No limitations as such. However how is a multifield going to help in this case? I want to limit the number of child components that can be added say 5. Therefore if it is possible to set the number of slides in container and dynamically add those many child components in container it would be great

Tethich

Accepted solution

Community Advisor

There is a way to limit the multifield, but needs custom code. Many already did it:

https://aemhints.com/2020/10/24/limit-multifield-aem65/

https://experienceleaguecommunities.adobe.com/t5/adobe-experience-manager/how-to-set-min-max-item-in...

As for adding dynamically those many children, it can be achieved by setting up initial content in your component template file.

TarunKumar

Community Advisor

HI @pleben ,

The standard approach for inserting a varying number of components, is to include the Paragraph System Component (parsys), and then let the author insert the components he or she needs (can be limited to allow only specific components).

In container component HTL file you can add data sly list statement which will inject reourcetype of specific component based on the dialog value. If dialog value is to add 2 components then run the list for two time to inject inner component.

-Tarun

PRATHYUSHA_VP

Community Advisor

Hi @pleben

To add dynamically the number of components based on the authoring, you can read the no. of items in sightly and iterate the child component resource using data-sly-list

Hope this helps

Thanks

Sign up

Login with SSO

Login to the community

Login with SSO

Scanning file for viruses.

This file cannot be downloaded