Expand my Community achievements bar.

Dive into Adobe Summit 2024! Explore curated list of AEM sessions & labs, register, connect with experts, ask questions, engage, and share insights. Don't miss the excitement.

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?