Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
Bedrock Mission!

Learn more

View all

Sign in to view all badges

SOLVED

Listeners implementations in touch UI.

Avatar

Level 2

Hi all,

I would like to know how can we call any servlet in touch ui dialog?

ie.

On select of dropdown i need to pass the selected value to servlet.

 

Thanks,

Shivamurthy Mn

1 Accepted Solution

Avatar

Correct answer by
Administrator

For Touch Ui (Dialog Listner) :- https://helpx.adobe.com/experience-manager/using/creating-touchui-events.html

    // (function ($, $document) {
        "use strict";
          $document.on("dialog-ready", function() {
            $(window).adaptTo("foundation-ui").alert("Open", "Dialog now open, event [dialog-ready]");
        });
        $(document).on("click", ".cq-dialog-submit", function (e) {
            //$(window).adaptTo("foundation-ui").alert("Close", "Dialog closed, selector [.cq-dialog-submit]");
        });
        $document.on("dialog-ready", function() {
            document.querySelector('form.cq-dialog').addEventListener('submit', function(){
                //$(window).adaptTo("foundation-ui").alert("Close", "Dialog closed, selector [form.cq-dialog]");
            }, true);
        });
        $document.on("dialog-success", function() {
            //$(window).adaptTo("foundation-ui").alert("Save", "Dialog content saved, event [dialog-success]");
        });
        $document.on("dialog-closed", function() {
            $(window).adaptTo("foundation-ui").alert("Close", "Dialog closed, event [dialog-closed]");
        });
    })($, $(document));

Extra reference articles are :-

Link:- https://helpx.adobe.com/experience-manager/using/creating-touchui-events.html

Link:- http://stackoverflow.com/questions/30053519/list-of-listeners-in-aem-6-for-touch-ui

Link:- http://experience-aem.blogspot.in/2015/02/aem-6-sp2-touch-ui-dialog-before-submit.html  // AEM 6 SP2 - Touch UI Dialog Before Submit Confirmation

 

Also you can use AEM Touch UI Custom Validation and in validate function you can check or trigger any event.

Link:- http://www.nateyolles.com/blog/2016/02/aem-touch-ui-custom-validation

 

I hope this would help you.

~kautuk

View solution in original post

3 Replies

Avatar

Correct answer by
Administrator

For Touch Ui (Dialog Listner) :- https://helpx.adobe.com/experience-manager/using/creating-touchui-events.html

    // (function ($, $document) {
        "use strict";
          $document.on("dialog-ready", function() {
            $(window).adaptTo("foundation-ui").alert("Open", "Dialog now open, event [dialog-ready]");
        });
        $(document).on("click", ".cq-dialog-submit", function (e) {
            //$(window).adaptTo("foundation-ui").alert("Close", "Dialog closed, selector [.cq-dialog-submit]");
        });
        $document.on("dialog-ready", function() {
            document.querySelector('form.cq-dialog').addEventListener('submit', function(){
                //$(window).adaptTo("foundation-ui").alert("Close", "Dialog closed, selector [form.cq-dialog]");
            }, true);
        });
        $document.on("dialog-success", function() {
            //$(window).adaptTo("foundation-ui").alert("Save", "Dialog content saved, event [dialog-success]");
        });
        $document.on("dialog-closed", function() {
            $(window).adaptTo("foundation-ui").alert("Close", "Dialog closed, event [dialog-closed]");
        });
    })($, $(document));

Extra reference articles are :-

Link:- https://helpx.adobe.com/experience-manager/using/creating-touchui-events.html

Link:- http://stackoverflow.com/questions/30053519/list-of-listeners-in-aem-6-for-touch-ui

Link:- http://experience-aem.blogspot.in/2015/02/aem-6-sp2-touch-ui-dialog-before-submit.html  // AEM 6 SP2 - Touch UI Dialog Before Submit Confirmation

 

Also you can use AEM Touch UI Custom Validation and in validate function you can check or trigger any event.

Link:- http://www.nateyolles.com/blog/2016/02/aem-touch-ui-custom-validation

 

I hope this would help you.

~kautuk

Avatar

Not applicable

To call any servlet in touchUi dialog visit following link for whole procedure:

Call any servlet in touchUI dialog |AEM 6.3+ – AEM Queries & Solutions