How to close a Liferay.util.openWindow popup window?

Question

I load the WebContent edit portlet on a Popup window using the following code:

<liferay-ui:icon 
    image="edit" 
    message="Edit" 
    url="<%= editUrl %>"
/>

The value for editUrl is:

editUrl = "javascript:Liferay.Util.openWindow({ 
dialog:{
    width: 960, 
    modal:true, 
    destroyOnClose: true
}, 
id: '" + liferayPortletResponse.getNamespace() + "', 
title: '" + article.getTitle(Locale.UK, true) + "', 
uri:'" + HtmlUtil.escapeURL(editPortletURLString) + "'});";

When the content is saved or published, the portlet is loaded on the popup window. I want the popup window to close and the portlet with the editURL link to refresh.

Gadroon

Answer 1

You can call the following javascript function from your pop-up only when the edit is successful and the pop-up gets refreshed:

Liferay.provide(
        window,
        'closePopUpAndRefreshPortlet',
        function(customPopUpId) {

            var A = AUI();

            A.DialogManager.closeByChild('#' + customPopUpId);

            var curPortletBoundaryId = '#p_p_id<portlet:namespace />';

            Liferay.Portlet.refresh(curPortletBoundaryId);
        },
        ['aui-dialog','aui-dialog-iframe']
    );

Explanation

The pop-up will be closed by providing the id: '" + liferayPortletResponse.getNamespace() + "' of the pop-up to the DialogManager's closeByChild function.

Liferay has defined a utility method to refresh the portlet through ajax, so you can just pass the portlet's <div id="p_p_id_MyWCDPortlet_"> to the refresh function.

So when the pop-up gets refreshed after a successful update, if you call the function closePopUpAndRefreshPortlet("customPopUpID") it first closes itself and then refreshes the parent <div> which is containing the portlet.

Hope this helps.

Jaffe

Answer 2

this page might be helpful - How to close a Dialog IFrame in Liferay 6.2

If you define your modal window like this (let's say in view.jsp):

<aui:button name="openDialog" type="button" value="open-dialog" />

    <liferay-portlet:renderURL var="dialogURL" windowState="<%=LiferayWindowState.POP_UP.toString() %>">
        <liferay-portlet:param name="mvcPath" value="/dialog.jsp" />
    </liferay-portlet:renderURL>
    <aui:script use="liferay-util-window">
    A.one('#<portlet:namespace/>openDialog').on('click', function(event) {
        Liferay.Util.openWindow({
            dialog: {
                centered: true,
                height: 300,
                modal: true,
                width: 400
            },
            id: '<portlet:namespace/>dialog',
            title: '<liferay-ui:message key="i-am-the-dialog" />',
            uri: '<%=dialogURL %>'
        });
    });
</aui:script>

and create button trigger (or onsubmit event listener in your case) inside the dialog page (dialog.jsp):

<aui:button name="closeDialog" type="button" value="close" />

<aui:script use="aui-base">
    A.one('#<portlet:namespace/>closeDialog').on('click', function(event) {
        // Let's suppose that "data" contains the processing results
        var data = ...
        // Invoke a function with processgin results and dialog id
        Liferay.Util.getOpener().<portlet:namespace/>closePopup(data, '<portlet:namespace/>dialog');
    });
</aui:script>

you will get the window that opened the dialog by getOpener() function. In page that creates the dialog (view.jsp), you have to provide the closePopup function like this:

<aui:script>
    Liferay.provide(
        window,
        '<portlet:namespace/>closePopup',
        function(data, dialogId) {
            var A = AUI();

            // Here you can use "data" parameter

            // Closing the dialog
            var dialog = Liferay.Util.Window.getById(dialogId);
            dialog.destroy();
        },
        ['liferay-util-window']
    );
</aui:script>

Capone

Hi, I have edited the answer - it was just my lazyness (to copy the previous answer to this question). Sorry for that. – Capone

Answer 3

In Liferay 7.x it works like the answer from shimon001 except that the button trigger (in dialog.jsp) has to look like this:

    <aui:button name="closeDialog" type="button" cssClass="km-button cancel" value='<%= LanguageUtil.get(themeDisplay.getLocale(), "label.cancel") %>'></aui:button>
    <aui:script use="aui-base">
        A.one('#<portlet:namespace/>closeDialog').on('click', function(event) {
            Liferay.Util.getWindow('<portlet:namespace/>Dialog').hide();
        });
    </aui:script>

Hotchkiss