Using Zen Components - InterSystems Documentation

8Popup Windows and DialogsThis chapter describes Zen components that “pop up” to display their contents over the main application page. The tradeofffor the flexibility provided by these components is that you must provide more programming in the page class to makethem effective. This chapter describes the following components:• Modal Groups — Make HTML content visible in response to a user event.• Popup Windows — Pop up a new window that displays a Zen page or any other content.• Dialogs — Pop up a dialog that prompts the user and accepts user input.8.1 Modal GroupsA modal group is a specialized group component that normally does not display its contents. When the modal group ismade visible, only its contents receive user events. Any event that occurs outside of the modal group (such as a mouseclick) automatically hides the modal group. Zen uses this modal mechanism when it creates drop-down menus and dropdowncombobox controls. You can also use this mechanism for popup items.You can define the contents of a modal group either by placing a component within the page class or bycreating an instance of the %ZEN.Component.modalGroup class programmatically. There are three options:• Static — Place a component in the page class XData Contents block. Its contents remain hidden untila client-side method on the page calls the modalGroup show method.• Dynamic — Have the page call its createComponent method to create a modalGroup component dynamically. Addcomponents to the group. Display it by calling the modalGroup show method.• Built-in — Have the page call the modalGroup show method to display one of the built-in modal groups: "msgBox"or "calendar"To close the current modal group, the page must invoke its endModal method. Generally endModal is triggered by anevent handler for one of the buttons in the modal group (OK, Cancel, or similar). It is an error to call endModal if there isno modal group currently displayed.While a modal group has the editing focus, keyboard controls are disabled. For example, it is not possible to use Tab tomove from field to field within the modal group. This prevents the user from (inadvertently) pressing Tab to navigatethrough all the fields and then back to the page, while the modal group has focus. The modal group keeps the focus untilthe user either clicks away from it or clicks the button that has been set up to close the modal group.Using Zen Components 221