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.
SOLVED

Custom clientlibs in edit mode

Avatar

Level 5

Hello,

I have noticed that if I open any page in touch UI edit mode (../editor.html/..), the custom clientlib javascript associated with the components get disabled.

For e.g. if there's a tab component and if the tab clicks are handled by custom javascript, the clicks don't work anymore in edit mode.

Is it possible to ensure the javascript remains functional even in edit mode?

1 Accepted Solution

Avatar

Correct answer by
Community Advisor

Hi,

I think the problem is with the DOM here.

In edit mode your components actual DOM is loaded inside iframe and the component editable div loaded top of that, since this editable div and z-index higher so you can't interact with actual Dom in Edit mode.

E.g. Tab components, you must have to switch from edit to preview in order to edit another tab.

How to add parsys to Touch UI Tab Component 

Screenshot 2019-03-17 at 8.46.02 PM.png



Arun Patidar

View solution in original post

4 Replies

Avatar

Community Advisor

Are you getting any error in the console ?

Avatar

Level 10

Go through the WEEKEND tutorial and you will see - once setup properly - clientlibs behave in TOuch UI, even in edit mode.

Avatar

Community Advisor

Few things you should check --

1. check in error.log if you are getting any error.

2. console error if any.

3. I am not sure but you can try putting condition in your sightly like if edit mode, then apply the clientlib accordingly. if disable then apply the preview mode javascript.

let us know if you find anything in this.

~ Prince

Avatar

Correct answer by
Community Advisor

Hi,

I think the problem is with the DOM here.

In edit mode your components actual DOM is loaded inside iframe and the component editable div loaded top of that, since this editable div and z-index higher so you can't interact with actual Dom in Edit mode.

E.g. Tab components, you must have to switch from edit to preview in order to edit another tab.

How to add parsys to Touch UI Tab Component 

Screenshot 2019-03-17 at 8.46.02 PM.png



Arun Patidar