Dynamic Multifield Length | Community
Skip to main content
Level 2
June 11, 2024
Solved

Dynamic Multifield Length

  • June 11, 2024
  • 3 replies
  • 1430 views

Depending on certain layout properties returned by the sling model, I would like to make either 1 or 2 multifield entries available in my dialog. Is there a way make the dialog display either 1 or 2 entries in a multifield? Is this best handled via validation scripts?

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 abhishekanand_

Hi @johns43992246 

 

  • While validation scripts can help enforce rules, they are typically used for validation (e.g., mandatory fields, data formats) rather than dynamically adjusting the number of multifield entries.

however you can try below steps:

 

  • Create a Sling Model associated with your component. Within the Sling Model, inject the dialog’s values using the @ValueMapValue annotation. Based on the layout properties, dynamically set the properties of the current page’s ValueMap.

    you can check the attached blog reference for more detailed walkthrough
    All About Dynamic Dropdown (Granite DataSource) in AEM - unLock Learning

3 replies

avesh_narang
Level 3
June 12, 2024

hey @johns43992246 ,

If you possess this data (maximum number of entries per multifield) prior to loading the dialog or during the dialog loading process, then you can proceed to register it with the foundation validator.

(function (document, $) { "use strict"; $(document).on('foundation-contentloaded', function () { //get max count with your business logic }); validation("./fieldName",maxCount); function validation(fieldName,maxCount) { $(window).adaptTo("foundation-registry") .register("foundation.validation.validator", { selector: 'coral-multifield[data-granite-coral-multifield-name^="' + fieldName + '"]', validate: function (el) { var totalCount = $(document).find(el).find('>coral-multifield-item').length; if (totalCount > maxCount) { return "Maximum Fields allowed are: " + maxCount; } } }, }); } })(document, Granite.$);

 

abhishekanand_
Community Advisor
abhishekanand_Community AdvisorAccepted solution
Community Advisor
June 13, 2024

Hi @johns43992246 

 

  • While validation scripts can help enforce rules, they are typically used for validation (e.g., mandatory fields, data formats) rather than dynamically adjusting the number of multifield entries.

however you can try below steps:

 

  • Create a Sling Model associated with your component. Within the Sling Model, inject the dialog’s values using the @ValueMapValue annotation. Based on the layout properties, dynamically set the properties of the current page’s ValueMap.

    you can check the attached blog reference for more detailed walkthrough
    All About Dynamic Dropdown (Granite DataSource) in AEM - unLock Learning
Abhishek Anand
Level 2
June 14, 2024

Honestly we discussed on my team and decided this would be too tricky to implement and decided to go another route. I think what was asking is a sort of anti-pattern for typical AEM component implementations. I was trying to use a parent component applied style classes to define the child component's number of multifield items. This could probably be done in the sling model on first initialization by creating those child nodes. Then the multifield will automatically have the correct number of multifields. Since we are going another route I won't bother trying to implement it.

kautuk_sahni
Community Manager
Community Manager
June 13, 2024

@johns43992246 Did you find the suggestions from users helpful? Please let us know if you require more information. Otherwise, please mark the answer as correct for posterity. If you've discovered a solution yourself, we would appreciate it if you could share it with the community. Thank you!

Kautuk Sahni