Dynamic Multifield Length

[johns43992246]

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?

[avesh_narang]

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_ · Accepted solution]

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

[johns43992246]

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]

@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!