Dialog. Базовые компоненты Extension Library

5-ый выпуск захватывающего детективного шоу...Базовые компоненты Extension Libarary!Сегодня говорим о <xe:Dialog>.

1. Application Layout

2. Navigator

3. Data View

4. Form Table (+Form Layout Column, Form Layout Row)

5. Dialog (+ Dialog Content, Dialog Button Bar)

6. Tooltip Dialog

--- Дополнительно ---

7. Widget Container

8. Bread Crumbs


Dialog
О назначении диалога говорить смысла нет, а вот как использовать соответствующий компонент расскажу.
При перетаскивании, компонент являет собой контейнер и выглядит следующим образом:

Пожалуй единственное базовое свойство при этом - title, отображающее название диалога.
Вызвать диалог можно либо с клиентской стороны:
XSP.openDialog("#{id:ID_диалога}")
либо с серверной:
getComponent('ID_диалога').show()

Для полноценной работы с содержимым диалога в область вставки необходимо поместить компоненты Dialog Content и Dialog Button Bar

Dialog Content
Это...еще один контейнер. В нем можно размещать другие компоненты: ввода, отображения информации.

Dialog Button Bar
Как водится - это контейнер для расположения кнопок управления диалогом (ОК, Отмена, ...)
Для закрытия диалога следует использовать команды:

с клиентской стороны: XSP.closeDialog('#{id:ID_диалога}') или XSP.closeDialog('#{id:ID_диалога}','#{id:ID_обновляемого_компонента}')

с серверной стороны: getComponent("ID_диалога").hide() или getComponent("ID_диалога").hide("ID_обновляемого_компонента"),

где ID_обновляемого_компонента - компонент, который обновляется после закрытия диалога

Пример использования диалога для контекстного редактирования можно посмотреть в обновленном варианте моего Demo-приложения.