Opening Modal Pop-up Dialogs

Pop-up dialogs are just normal Application Designer pages (except for a small difference) which are opened in modal pop-up mode. The pop-up management does not start a new browser instance - everything is done in the same instance in which you are working.

Invoking a pop-up dialog follows the same rules as navigating between pages. The Java source of the adapter looks as follows:

public void showPopup()
{
    // check if navigation is possible
    if (... any check is wrong...)
    {
        ...
        this.outputMessage("E","Opening pop-up is not possible...");
        return;
    }
    // open new page
    this.openPopup("pageName.html");
}

The adapter - which is used as a server-side counterpart of the pop-up dialog - is managed like navigating between pages. Therefore, you can access the adapter before opening the pop-up dialog and prepare some content:

public void showPopup()
{
    // check if navigation is possible
    if (... any check is wrong...)
    {
        ...
        this.outputMessage("E","Opening pop-up is not possible...");
        return;
    }
    // prepare adapter object which corresponds to next page
    XYZModel m = (XYZModel)this.findAdapter(XYZModel.class);
    m.setParam1(...);
    m.setParam2(...);
    ...
    ...
    // open new page
    this.openPopup("pageName.html");
}

This document covers the following topics:


Special Pop-up Dialog Parameters within the XML Layout Definition

Any Application Designer page can be opened as a pop-up dialog. Inside the PAGE tag of the page, you can define how to open the pop-up dialog. There are a couple of properties which can be used for this purpose:

  • popupwidth

  • popupheight

  • popupfeature

For further information, see the PAGE property definition in Typical Page Layout which is part of the Layout Elements documentation.

Passing Pop-up Dialog Parameters before Opening a Pop-up

The pop-up parameters (width, height, features) can also be passed before calling a pop-up. The Adapter class offers corresponding interfaces. The following code shows how to open a pop-up with a certain title and with a certain size and position:

/** */
public void onOpenPopup()
{
    setPopupFeatures(100, // x-position
                     100, // y-position
                     300, // width
                     200, // height
                     ""   // additional features as string (see PAGE-POPUPFEATURES docu)
                    );
    setPopupTitle("This is the title of the pop-up");
    openPopup("25_PositionedPopup1.html");
}

The parameters you pass override the parameters that may be defined in the pop-up page's layout definition.

Closing a Pop-up Dialog

A pop-up dialog can be closed by its corresponding adapter by the closePage() method which is inherited from the Adapter class:

/** This method is bound to the exit button of the pop-up page. */
public void exitPopup()
{
    // check if can be closed
    ...
    ...
    // close pop-up
    this.closePage();
}

In addition, a user can always close a dialog by pressing ALT+F4 or by choosing the close icon at the top right corner of the window title. The adapter - both adapters, the pop-up adapter and the adapter of the page from which the pop-up dialog was called - are not informed about this action and so it always has to be taken into consideration that a pop-up dialog might be closed by the user.

Changing the Size within an Opened Pop-up

Sometimes you need to resize the pop-up in which the user is currently working. For example, you want to show additional information and therefore have to increase the height of the pop-up.

The following code is inside the adapter object that belongs to the opened pop-up page:

public void onXxxxxx()
{
    findFunctionsLivingPopup().setPopupSize(m_newWidth,m_newHeight);
}