AEM 6.4 touch UI dialog | Reload the component dialog after select event

[#1]

Hi All,

I have a requirement where i need to reload the component(not page refresh) when changed the tag value.

At present i am refreshing the page using 

window.location.reload();

which is closing the dialog and refreshing the page, this is what i don't want.

Please advise, thanks in advance. 

Thanks,

Pradeep

[pradeepdubey82 · Accepted solution]

You can use REFRESH_SELF in _cq_editConfig.xml. Sample xml file is:

<?xml version="1.0" encoding="UTF-8"?>
<jcr:root xmlns:cq="http://www.day.com/jcr/cq/1.0" xmlns:jcr="http://www.jcp.org/jcr/1.0"
    jcr:primaryType="cq:EditConfig">
    <cq:listeners
        jcr:primaryType="cq:EditListenersConfig"
        afteredit="REFRESH_SELF"/>
</jcr:root>

See the example component implementation from /libs/foundation/components/carousel/cq:editConfig/cq:listeners.

[pradeepdubey82 · Accepted solution]

This is not working. Once i refresh the page then it is loading the new values in the dropdown. I am looking something which can be achieved without closing the dialog and page refresh.

[pradeepdubey82]

@pradeepdubey82 

Adding to @vanegi's response, the cq:listeners have a bit more properties than just afteredit, which you can try to see if it fits your needs:

beforedelete - The handler is triggered before the component is removed.
beforeedit - The handler is triggered before the component is edited.
beforecopy - The handler is triggered before the component is copied.
beforeinsert - The handler is triggered before the component is inserted.
beforechildinsert - The handler is triggered before the component is inserted.
Only operational for the touch-enabled UI.
beforemove - The handler is triggered before the component is moved.
afterdelete - The handler is triggered after the component is deleted.
afteredit - The handler is triggered after the component is edited.
aftercopy - The handler is triggered after the component is copied.
afterinsert - The handler is triggered after the component is inserted.
afterchildinsert - The handler is triggered after the component is inserted inside another component (containers only).
aftermove - The handler is triggered after the component is moved..

Values can be as:

REFRESH_SELF
REFRESH_PARENT
REFRESH_PAGE
REFRESH_INSERTED

 Reference: http://www.sgaemsolutions.com/2019/01/ootbcustom-cqlisteners-in-cqeditconfig.html

[pradeepdubey82]

All these properties works at component level. Like after component edit is completed, or delete etc. My requirement is lets say i have 2 widgets in component , after editing the value in first widget i am setting values for 2nd widget that is dropdown(multifield dropdown). These values are not picked at runtime, page need to be refreshed for this. So i want the things to work without refreshing the page. Isn't AEM has anything workaround for this problem?

[Briankasingli]

You would probably need to write a custom author cq hook, client library, to update the behavior of the touch ui dialogue.