Level 4

Solved

How to access a js function inside dialogs

13 replies
6377 views
Translate All

Hi,

i need to make a shared function with javascript. If i import the file inside the header of my page, the same function is not visible inside a dialog. It seems to be a different scope.

Is there a way to do it?

Thanks

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.

Kunal_Gaba_Accepted solution

New Member

You shouldn't be including javascript on the pages for dialog or any authoring related customizations. Rather you should create a JS client library and define category property of the client library node to "cq.widgets" for classic UI and "cq.authoring.dialog" for touch UI.

Examples-

For touch UI - /libs/cq/gui/components/authoring/dialog/image/clientlibs/image

edubey

Level 10

You are importing a piece of JS code in header of your page ?

how are trying to access the JS code in dialog?

Translate

Kunal_Gaba_Accepted solution

New Member

You shouldn't be including javascript on the pages for dialog or any authoring related customizations. Rather you should create a JS client library and define category property of the client library node to "cq.widgets" for classic UI and "cq.authoring.dialog" for touch UI.

Examples-

For touch UI - /libs/cq/gui/components/authoring/dialog/image/clientlibs/image

Translate

S

samuel786431Author

Level 4

Thanks kunal.

If i add the category cq.widgets the libraries are automatically charged during the starting of cq, right?

So this function will be available inside all of my projects? I need this function visible for only my current project.

Translate

Kunal_Gaba_

New Member

You can add a condition in your JS function to not to execute if the path is not specific to the project. CQ.WCM.getPagePath() will give you the path of the page in the javascript function.

Translate

edubey

Level 10

use cq:widgets only if its part of aem library, else if that JS code is part of your project code then use your own clientlib and make sure you load this clientlib only in project where you need this...

Translate

S

samuel786431Author

Level 4

I know only this way to load a clientlib: <cq:includeClientLib categories="myclientlib"/>

My dialog can be accessed under the siteadmin and the code inside the jsp isn't executed.

I can't use the cq:widgets because this code must be launched only in one project (i can't use a condition inside the function due to a project constrain)

Translate

edubey

Level 10

Can you give a brief of what you are trying to achieve or implement

Translate

Tyler_Maynard

Level 4

Are you working with TouchUI or Classic?

I have specific javascript for dialogs in my touchUI interface with the extraClientLibs property in my _cq_dialog node.

This is how I have added JavaScript to only specific dialogs. If the javascript function your trying to access is declared in another clientlib, then that clientlib should have the category cq.authoring.dialog/cq.widgets as mentioned above.

Translate

S

samuel786431Author

Level 4

Thanks Tyler, i'm working with the Classic UI.

The property extraClientLibs is exactly what i need, therefore a method to load js and css during the loading of the dialog.

But i can't find information about it and seems that doesn't work. If i access the dialog across the sidekick or across the siteadmin i can't see any trace about the static resources.

Translate

Sunil_Chowdhary

Level 2

Looks like solution to problem suggested is to use listener or dialog event to load clienlibs/js+css.

+ Points:- Not dependent on page jsp or siteadmin or site.

The js will get loaded before the dialog opens and gets rendered.

- Points:-The js events may not bind properly but it basically depends on js library included.

Translate

Show more replies

Sign up

Login with SSO

Login to the community

Login with SSO