Expand my Community achievements bar.

SOLVED

Using listeners inside multifield in AEM 6.3 touch UI

Avatar

Level 1

I am trying to use listeners for the nodes present inside the multifield for AEM 6.3 touch UI but the listeners are not working.

The same listener is working outside the multifield.

Kindly help me out in fixing the issue inside multifield.

1 Accepted Solution

Avatar

Correct answer by
Level 7

Hi,

You can follow the steps given in the following link for a custom listener in the multifield:

http://experience-aem.blogspot.in/2017/12/aem-63-sample-coral-3-multifield-item-listener.html

We have followed the same approach, only changing the JS to something simpler, and it is working for multifield node in AEM 6.3 . This is the JS that we used, where "name" should be the value of the 'name' property given to your node:

(function($, $document) {

    "use strict";

    $document.on("dialog-ready", function() {

        alert("ready");

        document.querySelector('input.coral-Form-field.coral-Textfield[name="./multititle"]').setAttribute("value", "this is value");

    });

})($, $(document));

For implementing listeners for events like page refresh on component edit you can follow the steps provided in the link below:

https://helpx.adobe.com/experience-manager/kb/RefreshPageWhenModifyDialog.html

This has also been checked for a multifield and is working fine.

Incase you are still facing the issue, please share the listener file that you are using and the multifield package.

Hope this helps!

TechAspect Solutions

View solution in original post

3 Replies

Avatar

Correct answer by
Level 7

Hi,

You can follow the steps given in the following link for a custom listener in the multifield:

http://experience-aem.blogspot.in/2017/12/aem-63-sample-coral-3-multifield-item-listener.html

We have followed the same approach, only changing the JS to something simpler, and it is working for multifield node in AEM 6.3 . This is the JS that we used, where "name" should be the value of the 'name' property given to your node:

(function($, $document) {

    "use strict";

    $document.on("dialog-ready", function() {

        alert("ready");

        document.querySelector('input.coral-Form-field.coral-Textfield[name="./multititle"]').setAttribute("value", "this is value");

    });

})($, $(document));

For implementing listeners for events like page refresh on component edit you can follow the steps provided in the link below:

https://helpx.adobe.com/experience-manager/kb/RefreshPageWhenModifyDialog.html

This has also been checked for a multifield and is working fine.

Incase you are still facing the issue, please share the listener file that you are using and the multifield package.

Hope this helps!

TechAspect Solutions

Avatar

Level 4

Hi @Techaspect_Solu ,

Can you please suggest on how to set one item as default in multifield component while authoring .

 

Thanks.

Avatar

Level 1

Hi,

Thanks for your valuable comments

We are not using separate js for the listeners.We are using the below mentioned default js file

/libs/cq/gui/components/authoring/dialog/dropdownshowhide/clientlibs/dropdownshowhide/js/dropdownshowhide.js

We went through your comments and didn't get exact solution what we are looking for.

We are referring the above mentioned js file for the listeners which is working fine for the selection

nodes(AEM 6.3 touch UI) outside the multifield node but the same is not working inside the multifield node(AEM 6.3 touch UI)

Regards,

Hariharan