[ELMA4] Всплывающее окно (Popover)

Всплывающий контент, у которого есть следующие параметры:

id – идентификатор popover;
parent – идентификатор родителя или сам родитель;
options – необязательный параметр для кастомных данных;
widthMode – ширина поповера.

Может иметь ряд дискретных значений: "xxs", "xs", "s", "m", "l", "xl", "xxl", "full". Они определяются в классе UIWindowSize.
Размер поповера, сопоставляемый с этими значениями, варьируется от самого маленького ("xxs") до самого большого ("full").

Подробнее об Options

Параметры попапа:

closeOnClick
closeOnEsc
useReferrer
onOpenScript
contentUrl
postData

Параметры для отображения поповера:

placement – местоположение относительно родителя. По умолчанию bottom.

Допустимые варианты: auto, top, right, bottom, left. Каждое место размещения может иметь вариант из этого списка: -start, -end.
Пример: bottom-end

removeArrow – убрать стрелку, установив значение true. По умолчанию removeArrow = null;
modifiers – кастомное поведение поповера.

Подробнее о Modifiers

shift – модификатор, используемый для смещения поппера на начало или конец своего родительского элемента.

preventOverflow – модификатор, используемый для предотвращения позиционирования поппера за пределами границы документа или указанного boundariesElement.

flip – модификатор, используемый для изменения положения поппера, когда он начинает перекрывать свой родительский элемент.

computeStyle – вычисление стилей.

// Пример
openPopoverWindow('myPopoverId’, 'myParentId’, {
  placement : ‘bottom’,
  modifiers : {
  preventOverflow : {
    // поповер не будет выходить за пределы myContainer
    boundariesElement : document.getElementById('myContainer')
  },
  flip : {
    behavior: ['left', 'bottom', 'top']
  },
  // кастомное смещение относительно родителя
  offset : {
    offset : 10 // "10, -20"
  }}});
// или
openPopoverWindow('myPopoverId', 'myParentId');

C#

Html.PopoverWindow – создание поповера на странице.

Параметры:

id – идентификатор поповера на странице;
content – идентификатор родителя или сам родитель;
widthMode – ширина поповера. Может иметь ряд дискретных значений из UIWindowSize.

Пример:

 @(Html.PopoverWindow("InpaymentStatusPopover",
    @<text>
        <div>SR.T("Текст в поповере")</div>
    </text>,
    UIWindowSize.Xxs))

Перегрузка метода Html.PopoverWindow.

Параметры:

popover – модель типа Popover.

Пример: отобразить заговолок поповера. Для отображения заголовка необходимо указать ShowHeader и Header.

@(Html.PopoverWindow(new Popover {
  PopupId = "InpaymentStatusPopover",
  WidthMode = UIWindowSize.Xxs,
  ShowHeader = true,
  Content = @<text>
    <div>SR.T("Текст в поповере")</div>
  </text>,
  Header = @<text>SR.T("Заголовок окна")</text>
})

JS

openPopoverWindow – открыть поповер на странице. Параметры:

id – идентификатор поповера на странице;
content – идентификатор родителя или сам родитель;
options – необязательный параметр для кастомных данных.

Пример:

@Html.Button()
    .Text(SR.T("Задать вопрос"))
    .Click("openPopoverWindow('Popover', this)")

refreshPopoverWindow – асинхронно обновить контент поповера и открыть. Параметры:

id – идентификатор поповера на странице;
content – идентификатор родителя или сам родитель;
options – необязательный параметр для кастомных данных.

Пример:

@Html.Button()
    .Text(SR.T("Задать вопрос"))
    .Click("refreshPopoverWindow(id, parent, {postData: postData, contentUrl: contentUrl})")

closePopoverWindow – закрыть поповер на странице. Параметр:

id – идентификатор поповера на странице.

Пример:

closePopoverWindow('Popover')

Установить заголовок. Пример:

var popover = $("#popoverId").data("tWindow");
popover.title("Заголовок окна");

[ELMA4] Всплывающее окно (Popover)

Подробнее об Options

Подробнее о Modifiers

Методы для работы с Popover

C#

JS