I have dropdown with (With Image, Without Image) -> I have created two multifield for which is adhering the showhide w.r.t dropdown value. It is working fine
For each multifield I have added JS which enables max-item and min item, for both the multifield I have min-item= 2,
If I choose with Image and add 4datasets in multifield 1,
it shows error saying minimum item should be 2, it is coming because it is asking me to add minimum two values for the other multifield as well..
How to fix this?
JS is attached below
(function ($, $document) {
"use strict";
$.validator.register("foundation.validation.validator", {
selector: "coral-multifield",
validate: function(el) {
var totalPanels = el["0"].items.getAll().length;
var min;
var max;
if ($(el).data("min-items")){
min = $(el).data("min-items");
if(totalPanels < min) {
return "Minimum numbers of items required are: " + min;
}
}
if ($(el).data("max-items")){
max = $(el).data("max-items");
if(totalPanels > max) {
return "Maximum numbers of items allowed are: " + max;
}
}
}});
})($, $(document));
Views
Replies
Total Likes
This is happening because the logic is getting applied to both the multifields.
What you need to do is use showhidetargetvalue with your multifield.
Reference: https://www.linkedin.com/pulse/aem-hideshow-drop-down-select-options-more-than-one-values-vikraman/
After you've done that, you just need to add another selector in your jQuery which will select only the selected item's container.
Something like [datashowhidetargetvalue="'+<value_of_dropdown>"']
That is already present still it is not working
Views
Replies
Total Likes
Hi,
In your above javascript, you need to filter out the target multifield based on dropdown value for validation.
Currently you are targeting all.
on dropdown select event you can call the same code again.