Liferay 6.2 modal add callback on close

Question

I need to excute a generic function (console.log) on closing (on hide) modal window created with this javascript code:

    YUI().ready(function(A) {
        YUI().use('aui-base','liferay-util-window', function(A) {
            Liferay.Util.Window.getWindow(
                {
                    title : title,
                    uri: url,
                    dialog: {
                        cache: false,
                        modal: true
                    }
                }
            ).on('hide', function() {
                  console.log("Modal closed")});

        });
    });

'url' and 'title' are two variables passing from code above.
It doesn't work.
Any suggestion?

is "hide" definitly the name of the event that **close** s the window? — JF it, Mar 18 '14 at 17:58

score 3 · Accepted Answer · answered Mar 19 '14 at 11:27

This will not work until you set destroyOnHide dialog option to true.

By default it is set to false, hence the popup will only be hidden.

See below:

YUI().ready(function(A) {
    YUI().use('aui-base','liferay-util-window', function(A) {
        Liferay.Util.Window.getWindow({
            title : title,
            uri: url,
            dialog: {
                destroyOnHide: true,
                cache: false,
                modal: true
            }
        }).after('destroy', function(event) {
                alert('DESTROY MODAL!');
        });
    });
});

Then you will be able to intercept destroy event with after() method as usual.

Hi, lets say we have a table and in runtime after ajax, i get data and append to popup, when it is closed i want to remove all json data in it (refresh) the template. Should i recreate ? I tried that also, but on('click') event can't catch new dom. — Sahin Yanlık, May 12 '16 at 04:10

score 1 · Answer 2 · answered Mar 18 '14 at 18:00

Hi replace your on('hide' with this:

YUI().ready(function(A) {
    YUI().use('aui-base','liferay-util-window', function(A) {
        Liferay.Util.Window.getWindow(
            {
                title : title,
                uri: url,
                dialog: {
                    cache: false,
                    modal: true
                }
            }
      ) on: {
      close: function(event) {
              console.log("Modal closed")});

    });
});

score 0 · Answer 3 · answered Mar 18 '14 at 20:44

The right event called on dialog close is destroy event.

Liferay Window extends A.Component which has destroy event. In fact to close a Window the right way is to call desploy() method.

AUI().ready(function(A) {
    AUI().use('aui-base','liferay-util-window', function(A) {

        Liferay.Util.Window.getWindow(
            {
                title : title,
                uri: url,
                dialog: {
                    cache: false,
                    modal: true
                }
            }
        ).after('destroy', function() {
              console.log("Modal closed");
        });

    });
});

Liferay 6.2 modal add callback on close

3 Answers3