Окно диалога подтверждения

Controls/popup:Confirmation — контрол, открывающий окно диалога подтверждения.

Размер окна

По умолчанию открывается модальное окно с кнопками подтверждения и отказа. Размер окна диалога подтверждения регламентируется стандартом и определяется опцией size.

Обработка выбора пользователя

Метод open() возвращает Deferred, который завершается с результатом пользовательского выбора (клика по кнопке диалога):

true — клик на кнопку "yes";
false — клик на кнопку "no";
undefined — клик на кнопку "cancel" или нажатие на клавишу Esc.

openConfirmation: function () {
   this._children.confirmation.open({
      message: "style='default'",
      noCaption: "no",
      yesCaption: "yes",
      cancelCaption: "cancel",
      type: "yesnocancel"
   }).addCallback(function (answer) {
      switch (answer) {
         case true:
            // ...some code...
            break;
         case false:
            // ...some code...
            break;
         default:
            // Блок обрабатывает значение undefined.
      }
   });
},

Пример конфигурации с использованием опенера Controls/popup:Confirmation:

// JavaScript
openConfirmation: function () {
   this._children.confirmation.open({
      type: "yesnocancel", 
      message: 'Сохранить документ?',
      style: 'success'
   });
}

<!-- WML -->
<Controls.popup:Confirmation name="confirmation" />
<Controls.buttons:Button
    name="confirmationButton"
    caption="Окно подтверждения"
    on:click="openConfirmation()" />

Окно подтверждения с пользовательским контентом

Может возникнуть потребность в особом окне подтверждения, с контентом, в котором лежат пользовательские контролы.

Для таких случаев предлагается использовать базовую раскладку диалога подтверждения Controls/popupConfirmation:Template с двумя контентными опциями bodyContentTemplate и footerContentTemplate.

Схема раскладки:

Ниже показан пример конфигурации пользовательского контента:

<!-- MyConfirmationTpl.wml -->
<Controls.popupConfirmation:Template style="success">
   <ws:bodyContentTemplate>
      <div style="text-align: center">
         Hello, It is Confirmation Template
      </div>
   </ws:bodyContentTemplate>
   <ws:footerContentTemplate >
      <div style="text-align: center">
         <Controls.buttons:Button caption="{{_options.value}}" on:click="_closeHandler()"/>
      </div>
   </ws:footerContentTemplate>
</Controls.popupConfirmation:Template>

// MyConfirmationTpl.js
define('Examples/Popup/Opener/MyConfirmationTpl',
   [
      'UI/Base',
      'wml!Examples/Popup/Opener/MyConfirmationTpl',
   ],
   function(Base, template) {
      'use strict';
      var Dialog = Base.Control.extend({
         _template: template,
         _closeHandler: function() {
            this._notify('close', [], {bubbling: true});
         },
      });
      return Dialog;
   }
);

Для конфигурации футера окна подтверждения можно использовать базовый шаблон Controls/popupConfirmation:Footer:

<!-- MyConfirmationTpl.wml -->
<Controls.popupConfirmation:Template style="success">
   <ws:bodyContentTemplate>
      <div style="text-align: center">
         Hello, It is Confirmation Template
      </div>
   </ws:bodyContentTemplate>
   <ws:footerContentTemplate>
      <Controls.popupConfirmation:Footer type="ok" okCaption="ok"/>
   </ws:footerContentTemplate>
</Controls.popupConfirmation:Template>

Для открытия окна подтверждения с кастомным контентом используют опенер Controls/popup:Dialog:

// JavaScript
openConfirmation: function () {
   this._children.myDialog.open();
},

<!-- WML -->
<Controls.popup:Dialog
   name="myDialog"
   template="wml!Examples/Popup/Opener/MyConfirmationTpl">
   <ws:templateOptions style="danger" size="m" value="Close" />
</Controls.popup:Dialog>
 
<Controls.buttons:Button
    name="confirmationButton"
    caption="Окно подтверждения"
    on:click="openConfirmation()" />

Метод openPopup() позволяет открыть окно уведомлений без использования открывающего контрола. Метод возвращает Promise, который в качестве результата отдаёт результат выбора в окне.

// JavaScript
openConfirmation() {
   Confirmation.openPopup({
      message: 'Choose yes or no'
   }).then(function(result) {
      if (result === true) {
          console.log('Пользователь выбрал "Да"');
      } else if (result === false) {
          console.log('Пользователь выбрал "Нет"');
      } else {
          console.log('Пользователь выбрал "Отмена"');
      }
   });
}

Как передать данные из всплывающего окна в родительский контрол

Читать подробнее.