popup - 如何在 Liferay 6.2 中关闭弹出窗口？

Question

我在Liferay 6.2 中使用 Liferay UI 弹出窗口。我正在弹出但我无法关闭它。为什么它不工作Liferay 6.2。

以下是我写在父页面上的代码：

AUI().ready(function(A) {
    AUI().use('aui-dialog', 'aui-io', function(A) {
        var url = '<%=testPopupURL.toString()%>';
        Liferay.Util.openWindow(
                {
                    dialog: {
                        cache: false,
                        width:800,
                        modal: true
                    },
                    id:'<portlet:namespace/>shahbaj',              
                    uri: url
                }
            );

    Liferay.provide(
        window,
        '<portlet:namespace />closePopup',
        function(popupIdToClose) {
            var A = AUI();
            alert(popupIdToClose);
            A.DialogManager.closeByChild('#' + popupIdToClose);
        },
        ['aui-base','aui-dialog','aui-dialog-iframe']
        );
    });
});

以下代码为弹窗内容：

<aui:button name="YES" value="YES" onClick="javascript:yes();"/>
<aui:script>
    function yes(){
        alert('pop');
        Liferay.Util.getOpener().<portlet:namespace />closePopup('<portlet:namespace />shahbaj');
    }
</aui:script>

请帮帮我！！

Answer 1

Add a Cancel / Close button with following script in your jsp.

<input type="button" onclick="hidePopup();" value="Cancel" />

function hidePopup(){
    AUI().ready('aui-dialog', function(A){
        A.DialogManager.hideAll();
    });
}

Answer 2

这有效！

AUI().ready(function(A) {
        AUI().use('aui-dialog', 'aui-io', function(A) {
                var url = 'http://localhost/url';
    Liferay.Util.openWindow(
            {
                dialog: {
                    cache: false,
                    width:800,
                    modal: true
                },
                   id:'shahbaj',              
                uri: url
            }
        );
 Liferay.provide(
        window,
       'closePopup',
        function(popupIdToClose) {
            var dialog = Liferay.Util.getWindow(popupIdToClose);
            dialog.destroy(); // You can try toggle/hide whatever You want
        },
        ['aui-base','aui-dialog','aui-dialog-iframe']
    );
        }); 
});

Answer 3

更简单的解决方案

一个更简单的解决方案是使用close-panel类名。

<aui:button cssClass="close-panel" type="cancel" value="close" />

无需额外的 JavaScript。