Элементы управления

Элементы управления — это объекты, которые используются для организации взаимодействия между пользователем и приложением. Например, кнопки, детали, поля и т. д. Как правило, элементы управления отображаются в навигационных панелях, диалоговых окнах и на панелях инструментов.

Terrasoft.controls.Component — родительский класс для элементов управления. Родительским классом для класса Component является класс Terrasoft.BaseObject. Миксин Bindable класса Component позволяет связать свойства элемента управления с необходимыми свойствами, методами или атрибутами модели представления.

Для корректной работы в элементе управления объявляются события. События, которые элемент управления наследует от класса Component:

• added — срабатывает после добавления элемента в контейнер.
• afterrender — срабатывает после рендеринга элемента управления и добавления HTML-представления в DOM.
• afterrerender — срабатывает после рендеринга элемента управления и обновления HTML-представления в DOM.
• beforererender — срабатывает перед рендерингом элемента управления и добавления HTML-представления в DOM.
• destroy — срабатывает перед окончательным уничтожением элемента управления.
• destroyed — срабатывает после удаления элемента управления.
• init — срабатывает после инициализации элемента управления.

Подробнее о событиях класса Component читайте в Библиотеке JS классов.

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

Реализуйте элемент управления в массиве модификаций diff.

/* Массив модификаций diff. */
diff: [{
    /* Операция добавления. */
    "operation": "insert",
    /* Имя родительского элемента, в который выполняется вставка. */
    "parentName": "CardContentContainer",
    /* Свойство элемента родителя, с которым выполняется операция. */
    "propertyName": "items",
    /* Имя сущности. */
    "name": "ExampleButton",
    /* Значения элемента управления.
    Свойства, которые передаются в конструктор компонента. */
    "values": {
        /* Тип добавляемого элемента — кнопка. */
        "itemType": "Terrasoft.ViewItemType.BUTTON",
         /* Заголовок кнопки. */
        "caption": "ExampleButton",
        /* Привязка метода-обработчика нажатия кнопки. */
        "click": {"bindTo": "onExampleButtonClick"}, 
        /* Стиль отображения кнопки. */
        "style": Terrasoft.controls.ButtonEnums.style.GREEN
    }
}]

Внешний вид элемента управления определяется шаблоном (template <tpl>). Представление элемента генерируется согласно заданному шаблону во время рендеринга элемента управления в представление страницы.

Элемент управления не имеет бизнес-логики. Бизнес-логика реализована в модуле, в который добавляется элемент управления.

Элемент управления имеет атрибуты styles и selectors, которые определены в родительском классе Component. Эти атрибуты позволяют гибко настраивать стили.