Custom js or show hide in multifield

[Ronnie09]

I have one component 

In this whenever enable image variation is selected then in Multifield I want Image and caption should be appearing else no image and caption should be there, 

I cant achieve this.

[Himanshu_Jain]

Kindly check the below link.

link 

[SantoshSai · Accepted solution]

Hi @Ronnie09 

If you want to show and hide fields on the basis of drop-down you can write custom JS to achieve the same
try this

function showHide() {
        let defaultt = $(".default").prop("selected");
        let red = $(".red").prop("selected");
        let green = $(".green").prop("selected");

        if (defaultt) {
            $(".text").removeAttribute("hidden");
            $(".checkbox").removeAttribute("hidden");
        } else {
            $(".text").setAttribute("hidden", true);
            $(".checkbox").setAttribute("hidden", true);
        }
        if (red || green) {
            $(".newdropdown").removeAttribute("hidden");
        } else {
            $(".newdropdown").setAttribute("hidden", true);
        }
    }

References:
1. http://www.sgaemsolutions.com/2019/01/showhide-tabs-and-fields-based-on-drop.html 
2. https://www.linkedin.com/pulse/aem-hideshow-drop-down-select-options-more-than-one-values-vikraman/?...
3. https://aem4beginner.blogspot.com/showhide-tabs-and-fields-based-on-drop

Hope that helps!

Regards,
Santosh