Expand my Community achievements bar.

Guidelines for the Responsible Use of Generative AI in the Experience Cloud Community.

image drag and drop required field should apply only when variation selected

Avatar

Level 2

Hi 

I have a component with two variations which have Drag and drop image field in both the variations, Image field in both the variations are required field.

I have a added required.js file to my component, the problem is when I select one variation and filled the mandatory fields and try to submit it is not submitting and it is highlighting the image field in other variation.

I want image field to be highlighted only when I select the particular variation and if it is not authored. 

I have attached the validation code which I used in my component, Please advice.

8 Replies

Avatar

Level 10

I don't think AEM has any properties which takes care of it.

All I think of is you need write your own validation. 

1. Remove all required attribute by default

2. When user select a particular variation, add required attribute only to the field of selected variation.

3. Make sure you change this when user toggle variation.

Thanks

Avatar

Level 2

Hi,

Can you please, provide me the sample validation script for variation.

Avatar

Level 10

Can you show a screen shot of your component and component dialog so it clearer what exactly you want to do. I am not clear on what you mean. 

Avatar

Level 2

Hi 

I have component in which I have two variations graphical and text, In In both variations image is required field 

I just want image to be drag and dropped I don't want the upload functionality,  I Have added required.js file to my component

After adding required.js once I authored the graphical layout and try to submit it is not allowing me to submit, it is making image field in text variation as required.

the required.js which I added it is making all the image fields in component as required, I wanted it to be highlighted only when I select the variation.

I have attached the js code and screenshot of my component structure

Avatar

Level 2

Hi Edubey I am trying to write custom validation code for this but it is so complex and I am not able to get it work as expected, please help.

Thanks in advance.

Avatar

Level 10

Are you working in Classic UI or Touch UI?