API

Подключение и использование

Подключение на PHP-странице

\Bitrix\Main\UI\Extension::load("ui.alerts");

Использование

Метод getContainer() возвращает верстку предупреждения.

var myAlert = new BX.UI.Alert({ 
	/*[options]*/ 
});

myAlert.getContainer()

С версии UI 21.800 появились методы:

renderTo(element) - метод, в котором можно указать ноду для рендеринга алерта.

destroy() - метод уничтожает экземпляр алерта.

Параметры

Текст

text - может принимать html.

var myAlert = new BX.UI.Alert({ 
	text: "<strong>Внимание!</strong> Текст предупреждения находится здесь.",
	inline: true
});

//------------

myAlert.setText("<strong>Внимание!</strong> Текст предупреждения находится здесь.");

Размер

size {string}- определяет размер алерта.

var myAlert = new BX.UI.Alert({ 
	size: BX.UI.Alert.Size.SMALL
});

//------------

myAlert.setSize(BX.UI.Alert.Size.SMALL);

Возможные значения:

BX.UI.Alert.Size.MEDIUM //Default
BX.UI.Alert.Size.SMALL

Цвет

color {string} - определяет цвет предупреждения.

var myAlert = new BX.UI.Alert({ 
	color: BX.UI.Alert.Color.WARNING
});

//------------

myAlert.setColor(BX.UI.Alert.Color.SUCCESS);

Возможные значения:

BX.UI.Alert.Color.PRIMARY 
BX.UI.Alert.Color.SUCCESS
BX.UI.Alert.Color.WARNING
BX.UI.Alert.Color.DANGER

Иконки

icon {string} - добавляет иконку

BX.UI.Alert({ 
	icon: BX.UI.Alert.Icon.INFO
});

Возможные значения:

BX.UI.Alert.Icon.INFO
BX.UI.Alert.Icon.WARNING
BX.UI.Alert.Icon.DANGER

Закрыть

closeBtn {boolean} - добавляет крестик в правый верхний угол предупреждения. Клик на крестик удаляет .ui-alert и все его содержимое из DOM.

BX.UI.Alert({ 
	closeBtn: true
});

Анимация закрытия/открытия

animate {boolean} - добавляет эфекты при появлении или удалении предупреждения.

BX.UI.Alert({ 
	animate: true
});

Блочно-строчный контейнер

inline {boolean} - добавляет алерту свойства inline-block элемента.

BX.UI.Alert({ 
	inline: true
});