Options
All
  • Public
  • Public/Protected
  • All
Menu

Class UIContextMenu<T>

Type parameters

  • T

Hierarchy

Implements

Constructors

constructor

Properties

Optional addListener

addListener: TypeEventRecordListener<EventEmitter, T, "addListener">

alignItems

alignItems: AlignItems

Свойство указывает как выравнивать элементы. Выравнивание происходит поперек главной оси флекс контейнера.

Добавляет атрибут align-items в HTML элемент. Если свойство не задано, то атрибут не добавляется.

См. AlignItems.

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

alignSelf

alignSelf: AlignSelf

Расплагает элемент в одну из девяти позиций:

  • по вертикали: top, center, bottom;
  • по горизонтали: left, center, right.

ПРИМЕР

export var list: IList = <IList>{
     ...
     alignSelf: AlignSelf.topCenter,
     ...
}

Если задано, то к html элементу добавляется соответствующий класс, например для элемента из примера topCenter.

Cм. AlignSelf

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

allowOverflow

allowOverflow: boolean

Свойство указывает на наличие полосы прокрутки. Если значение true, то добавляет атрибут overflow-auto в HTML элемент.

ancestor

ancestor: IMenu<IMenuEvents>

Предок. В этом свойстве указано меню, элементы которого должны быть унаследованы. Причем, наследуются только элементы. Если у предка тоже задано свойство ancestor, то наследуются элементы из всех предков.

ПРИМЕР

export var fileMenu: IMenu = <IMenu>{
     ...
     elements: [
         <IMenuItem>{
             type: 'IMenuItem',
             name: 'open',
             caption: 'Открыть',
             ...
         },
         <IMenuItem>{
             type: 'IMenuItem',
             name: 'close',
             caption: 'Закрыть',
             ...
         },
     ]
}

export var mainMenu: IMenu = <IMenu>{
     ...
     ancestor: fileMenu,
     elements: [
         <IMenuItem>{
             type: 'IMenuItem',
             name: 'edit',
             caption: 'Редактировать',
             ...
         }
     ]
}

В примере меню mainMenu будет иметь три элемента:

Открыть
Закрыть
Редактировать

bindingProperty

bindingProperty: string

Свойство указывающее на данные.

ПРИМЕР данных

const person = {
 "firstName": "Иван",
 "secondName": "Иванович",
}

ПРИМЕР описания формы, где в коментариях указано, какие данные будет содержать элемент, после установки данных AppManager.forms.setData('dataForm', person).

export var form: IForm = <IForm>{
    ...
    name: "dataForm",
    bindingProperty: '', //data = {"firstName": "Иван", "secondName": "Иванович"}
    elements: [
        <IProperty>{
            ...
            bindingProperty: 'firstName', //data = "Иван"
        },
        <IProperty>{
           ...
            bindingProperty: 'secondNamae', //data = "Иванович"
        },
        <IButton>{
            ...
            onClick: function () {
                alert("Data sent!")
            }
        },
   ]
}

Как система управляет данными в элементах формы смотрите {@link UseData | здесь}

bordered

bordered: boolean

Устанавливает окантовку элементу управления. По умолчанию false.

caption

caption: string

Заголовок элемента.

ПРИМЕР

export var list: IList = <IList>{
     ...
     caption: "Список продуктов",
     ...
}

Заголовок отображается в верхней части элемента. Например:

<div class='app ui-list' id='a57cf348' name='productsList'>
     'Список продуктов'
     <div class='menu fixed'>...</div>
     <div class='content flexible'>...</div>
<div>

Заголовок подставляется в текст элемента, если свойство IElement.value не задано, для следующих элементов: IElement, IDataElement, IButton, IMenuItem.

dom

dom: HTMLElement

Возвращает узел HTML элемента.

ПРИМЕР

export var list: IList = <IList>{
     ... ,
     onclick: function(form: IForm, elem: IList, item: IListItem): Promise<void> {
         var dom: HTMLElement = elem.dom; //IList inherit IElement
     }
}

domContentEditable

domContentEditable: HTMLElement

elements

elements: IMenuItem<IMenuItemEvents>[] = ...

Список элементов меню. Задается как массив JSON объектов. Перед объектом укажите тип элемента, <IMenuItem>. Это поможет вам не ошибиться. IDE обычно подсказывает какие свойства дожны присутствовать для этого типа.

ПРИМЕР

export var myMenu: IMenu = <IMenu>{
      type: 'IMenu',                         //inherited
      name: 'myMenu',                        //inherited
      bindingProperty: '',                   //inherited                   
      grouping: Grouping.horizontal,         //inherited
      flex: Flex.flexible,                   //inherited  
      elements: [                            //overrided - Элементы только IMenuItem.
         <IMenuItem>{
             type: 'IMenuItem',              
             name: 'openMenuItem1',           
             caption: 'Отрыть',   
             onClick: async function(event: IMenuEvent, form: IForm, menu: IMenu, item: IMenuItem){
                 alert(`Команда меню ${item.caption} выполнена!`);
             } 
         },
         <IMenuItem>{
             type: 'IMenuItem',              
             name: 'openMenuItem2',           
             caption: 'Закрыть',             
             onClick: async function(event: IMenuEvent, form: IForm, menu: IMenu, item: IMenuItem){
                 alert(`Команда меню ${item.caption} выполнена!`);
             } 
         },
      ],
}

в процессе выполнения значение этого свойства возвращает массив элементов группы, причем если задано свойство ancestor, то добавляются все элементы предка.

Optional emit

emit: TypeEmitRecord<EventEmitter, T>

flex

flex: Flex

Свойство, указывающее на способ позиционирования элемента внутри группы (по умолчанию гибкое - flexible):

  • гибкое (Flex.flexible) - элемент занимает все свободное место, В реальности элементу устанавливается свойство flex: 1 1 auto; т.е. он может растягиваться или сжиматься вдоль главной оси флекс контейнера.
  • фиксированное (Flex.fixed) - элемент занимает место ровно по своему размеру. В реальности элементу устанавливается свойство flex: 0 1 auto; т.е. он может только сжиматься вдоль главной оси флекс контейнера.

См. Flex.

form

Возвращает форму (IForm), которой принадлежит элемент.

ПРИМЕР

export var list: IList = <IList>{
     ... ,
     async onClick(e: IMouseEvent, form: IForm, elem: IList, item: IListItem): Promise<boolean> {
         var _form: IForm = elem.form; //IList inherit IElement
         return true;
     }
}

grouping

grouping: Grouping

Свойство, указывающее на способ группировки элементов группы (по умолчанию вертикально). Реализовано два спосооба группировки:

  • горизонтально (Grouping.horizontal),
    Элемент 1 Элемент 2 Элемент 2 Элемент 2
  • вертикально (Grouping.vertical).
    Элемент 1
    Элемент 2
    Элемент 3
    Элемент 4

См. Grouping.

href

href: string

Устанавливает в элемент гиперссылку

let elem: IElement = <IElement>{
 type: 'IElement',
 href: 'https://ui-organizer.ru',
 value: 'ui-organizer',
}

Результат:

 <div class='app ui-element'>
    <a href='https://ui-organizer.ru'>ui-organizer</a>
 </div>

id

id: string

Возвращает идентификатор элемента. Идентификатор задается системой при создании элемента.

ПРИМЕР

export var list: IList = <IList>{
     ... ,
     async onСlick(event:UIMouseEvent, form: IForm, elem: IList, item: IListItem): Promise<void> {
         console.log(`Идентификатор элемента ${elem.id}`);
     }
}

Из идентификатора формируется атрибут id HTML элемента.

Результат следующий:

<div class="..." id="abcff8d5" />

По id, также осуществляется доступ к элементу формы из любого метода объекта:

AppManager.ActiveForm.getElementById('abcff8d5');

justifyContent

justifyContent: JustifyContent

Выравнивание текста внутри элемента. Так как все элементы являются флекс контейнерами, то и выравнивание внутри элемента или группы происходит с использованием HTML стиля justify-content.

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

ПРИМЕР

export var someGroup: IGroup = <IGroup>{
     ...
     justifyContent: JustifyContent.start,
     ...
}

Если задано, то соответствующий класс будет добавлен к html элементу.

<div class='... left'/>
.left{
     justify-content: left
}

name

name: string

Наименование элемента латиницей. Не должно содержать управляющих символов и пробелов. Необязательно.

ПРИМЕР

export var productsList: IList = <IList>{
     ...
     name: 'productsList',
     ...
}

Из названия формируется атрибут name HTML элемента.

Результат следующий:

<div class="..." name="productsList" />

По названию, также осуществляется доступ к элементу формы из любого метода объекта:

AppManager.ActiveForm.getElement('productsList');

Optional on

on: TypeEventRecordListener<EventEmitter, T, "on">

Optional once

once: TypeEventRecordListener<EventEmitter, T, "once">

owner

Возвращает элемент (наследник IContextElement), которому принадлежит этот элемент.

ПРИМЕР

export var elem: IElement = <IElement>{
     ... ,
     async onClick(e: IMouseEvent, form: IForm, elem: IElement, item: IElement): Promise<boolean> {
         var owner: IContextElement = elem.owner;
         return true;
     }
}

Элемент:

  • либо имеет значение в свойстве owner - это значит, что создан и принадлежит какому-то элементу (например, является элементом строки IList IListItem.element), - тогда свойство parent = undefined;
  • либо имеет значение в свойстве parent - это значит, что добавлен в группу IGroup.elements, - тогда свойство owner = undefined;
  • либо оба свойства undefined - это только у формы IForm.

parent

Возвращает родительскую группу (IGroup), которой принадлежит элемент.

ПРИМЕР

export var list: IList = <IList>{
     ... ,
     async onClick(e: IMouseEvent, form: IForm, elem: IList, item: IListItem): Promise<boolean> {
         var form: IGroup = elem.parent; //IList inherit IElement
         return true;
     }
}

Элемент:

  • либо имеет значение в свойстве owner - это значит, что создан и принадлежит какому-то элементу (например, является элементом строки IList {@link IList.element}), - тогда свойство parent = undefined;
  • либо имеет значение в свойстве parent - это значит, что добавлен в группу IGroup.elements, - тогда свойство owner = undefined;
  • либо оба свойства undefined - это только у формы IForm.

positionAbsolute

positionAbsolute: boolean

Устанавливает элемент в абсолютную позицию. Чаще испльзуется для задания контекстного меню или всплывающего диалога.

ПРИМЕР

export var list: IList = <IList>{
     ...
     positionAbsolute: true,
     ...
}

Если задано, и значение true, то к html элементу добавляется класс positionAbsolute. CSS

.positionAbsolute{
     position: absolute;
}

Optional prependListener

prependListener: TypeEventRecordListener<EventEmitter, T, "prependListener">

Optional prependOnceListener

prependOnceListener: TypeEventRecordListener<EventEmitter, T, "prependOnceListener">

readonly

readonly: boolean

Доступность элемента только для чтения.

ПРИМЕР

export var list: IList = <IList>{
     ...
     readonly: true,
     ...
}

Если значение true, то к html элементу добавляется класс readonly.

<div class="... readonly"/>

Optional removeListener

removeListener: TypeEventRecordListener<EventEmitter, T, "removeListener">

size

size: string

stylesheets

stylesheets: string | string[]

Свойство указывает, какой css файл применить к этой группе.

tabindex

tabindex: number

Позволяет разработчикам делать элементы управления фокусируемыми, разрешать или запрещать их последовательную фокусировку (обычно с помощью клавиши tab, отсюда и название) и определять их относительный порядок для последовательной навигации между элементами формы

Порядок навигации (при нажатии клавиши tab) следующий:

  • Элементы с положительным tabIndex фокусируются в порядке номера tabIndex. Навигация осуществляется от самого низкого tabIndex к самому высокому tabIndex.
  • Элементы, у которых tabIndex = 0, и элементы, имеющие одинаковые tabIndex значения, фокусируются в порядке их расположения на форме.
  • Элементы с отрицательным tabIndex фокусируются только программно.

textSelect

textSelect: boolean

Возможность выделения текста внутри элемента на html странице.

ПРИМЕР

export var list: IList = <IList>{
     ...
     textSelect: false,
     ...
}

Если задано, и значение false, то к html элементу добавляется класс unselectable. CSS

.unselectable {
     user-select: none;
}

type

type: string = 'IContextMenu'

Свойство, которое описывает тип объекта, который будет создан. Тип должет реализовывать этот интерфейс. В примере ниже тип UIList реализует интерфейс IList.

ПРИМЕР

export var list: IList = <IList>{
     type: 'IList',
     ...
}

По типу объекта формируется название класса HTML элемента. Для этого в начало типа добавляется префикс: "ui-".

Для html элемента объекта из примера результат следующий:

<div class="... ui-list" id="..." />

value

value: any

Текст HTML элемента.

Если вы хотите установить текст HTML элемента IElement задайте значение value.

В процессе описания:

let baseElem: IElement = <IElement>{
    type: 'IElement',
    name: 'baseElem',
    value: 'Элемент' 
}

Либо в процессе выполнения:

let baseElem: IElement = <IElement>{
    type: 'IElement',
    name: 'baseElem',
    caption: 'Базовый элемент',
    onAfterLoad: async function (event: UILoadEvent, form: IForm, elem: IElement) {
        elem.value = 'Элемент';
    }   
}

Результат следующий:

<div class='app ui-element' id='a77ch448' name='baseElem'>
     'Элемент'
<div>

Если value не задано, то текст элемента принимает значение свойства IElement.caption, если caption не задан, то текст элемента принимает значение свойства IElement.name для следующих элементов: IElement, IDataElement, IButton, IMenuItem.

Если value == undefined, то значение устанавливается из данных при первоначальном заполнении и последующих вызовах метода setData() для всех наследников IDataElement.

visibility

visibility: boolean

Видимость элемента.

ПРИМЕР

export var list: IList = <IList>{
     ...
     visibility: true,
     ...
}

При установке значения генерируются события:

  • "show" при visibility = true,
  • "hide" при visibility = false.

ПРИМЕР прослушивания этих событий

function addListener(elem: IElement) {
     elem.on("hide", ()=>{
         console.log("Элемент скрыт");
     })
}

Methods

addClass

  • addClass(className: string): void
  • Добавляет класс к HTML элементу.

    ПРИМЕР

    function someFunction(elem: IElement) {
         elem.addClass("someClass");
    }
    

    РЕЗУЛЬТАТ

    <div class="someClass"></div>
    

    Parameters

    • className: string

    Returns void

addElement

  • Добавляет элемент в процессе выполнения.

    ПРИМЕР

    export var someGroup:IGroup = <IGroup>{
          type: 'IGroup',
          name: 'someGroup',
          bindingProperty: '',
          grouping: Grouping.vertical,
          flex: Flex.flexible,
          elements: [],
          onBeforeLoad: function (form: IForm, group: IGroup, data: any) {
             //data.elements Должен содержать массив JSON объектов IElement
             if(data && data.elements) {
                 (<Array<IElement>>data.elements).forEach(item => {
                     group.addElement(item);
                 })
             }
          }
    }
    

    Parameters

    Returns Promise<IElement<IElementEvents>>

addStyle

  • addStyle(property: string, value: string): void
  • Добавляет стиль к HTML элементу.

    addStyle('color', 'grey');
    

    Добавит к HTML элементу атрибут style:

    <div class='app ui-element' style='color:grey;'>
    

    Parameters

    • property: string
    • value: string

    Returns void

blur

  • blur(): Promise<void>
  • Убирает фокус с элемента.

    Returns Promise<void>

collectData

  • collectData(data?: any): any
  • Собирает данные со всех подэлементов. Внутреннее свойство _data остается неизменным.

    • Если передать данные текущего элемента, тогда в передавемых данных изменится только атрибут, соответствующий свойству 'bindingProperty' подэлемента.
    • Если передать данные, в которых нет атрибута, соответствующего свойству 'bindingProperty', тогда такой атрибут с данными элемента добавится.
    • Если передать undefined, тогда будет создан объект с данными подэлементов, у которых есть свойство bindingProperty.

    Parameters

    • Optional data: any

    Returns any

    Возвращаемые данные зависят от передаваемых данных.

edit

  • edit(elementId: string): Promise<string>
  • Вызывает режим редактирования элемента. По завершении редактирования устанавливает значение IElement.value. Возвращает результат редактирования.

    Parameters

    • elementId: string

    Returns Promise<string>

focus

  • focus(): Promise<void>
  • Устанавливает фокус на элементе.

    Returns Promise<void>

getChainElementsById

  • Осуществляет поиск элемента по идентификатору, включая все элементы всех дочерних групп. Возвращает массив с цепочкой всех элементов, где array[0] - сам элемент, а последний в массиве - искомый элемент.

    Parameters

    • id: string
    • Optional throwNotFound: boolean

    Returns IElement<IElementEvents>[]

getData

  • getData(data?: any): any
  • Получает данные элемента, записанные во внутреннем свойстве _data. Во внутреннем свойстве _data хранятся изначальные данные (если вы их, конечно, не изменяяете в методах) и не зависят от изменений подэлементов.

    ПРИМЕР сначала устанавливаем данные

    export var dataElem: IDataElement = <IDataElement>{
        type: 'IDataElement',
        name: 'dataElement',
        bindingProperty: "firstName"
    }
    ...
    (async function setData(){
         var elem = AppManager.activeForm.getElement("dataElement");
         await elem.setData({firstName: "Иван"});//во внутреннем свойстве elem._data сохранены данные "Иван".
    })();
    

    ПРИМЕР теперь получаем данные:

    • Если передать данные родительского элемента, тогда в передавемых данных изменится только атрибут, соответствующий свойству 'bindingProperty'.
         var elem = AppManager.activeForm.getElement("dataElement");
         console.log(elem.getData({firstName: "Петр", secondName: "Петров"}));
      
      РЕЗУЛЬТАТ
      {
         firstName: "Иван", 
         secondName: "Петров"
      }
      
    • Если передать данные, в которых нет атрибута, соответствующего свойству 'bindingProperty', тогда такой атрибут с данными элемента добавится.
         var elem = AppManager.activeForm.getElement("dataElement");
         console.log(elem.getData({}));
      
      РЕЗУЛЬТАТ
      {
         firstName: "Иван"
      }
      
    • Если передать undefined, тогда будут возвращены непосредственно данные элемента.
         var elem = AppManager.activeForm.getElement("dataElement");
         console.log(elem.getData(undefined));
      
      РЕЗУЛЬТАТ
      "Иван"
      

    Parameters

    • Optional data: any

    Returns any

    Возвращаемые данные зависят от передаваемых данных.

getElement

  • Осуществляет поиск элемента по названию, включая все элементы всех дочерних групп.

    Parameters

    • elemName: string
    • Optional throwNotFound: boolean

    Returns IElement<IElementEvents>

getElementById

  • Осуществляет поиск элемента по идентификатору, включая все элементы всех дочерних групп.

    Parameters

    • id: string
    • Optional throwNotFound: boolean

    Returns IElement<IElementEvents>

getNext

  • Возвращает следующий элемент, от передаваемого, в списке элементов группы. Если передаваемый элемент последний в группе, то возвращиется undefined.

    Parameters

    Returns IElement<IElementEvents>

getPreviouse

  • Возвращает предыдущий элемент, от передаваемого, в списке элементов группы. Если передаваемый элемент первый в группе, то возвращается undefined.

    Parameters

    Returns IElement<IElementEvents>

getType

  • getType(): string
  • Возвращает название типа элемента: "RuntimeElement", "RuntimeDataElement" и т.д.

    Returns string

hasClass

  • hasClass(className: string): boolean
  • Проверяет наличие класса в HTML элементе.

    Parameters

    • className: string

    Returns boolean

isFocused

  • isFocused(): boolean
  • Имеет ли элемент фокус.

    Returns boolean

isType

  • isType(type: string | typeof UIElement): this
  • Проверяет тип элемента. Тип элемента, который определен в свойстве IElement.type.

    Parameters

    • type: string | typeof UIElement

    Returns this

onAfterEdit

  • Этот метод вызывается после редактирования элемента в результате вызова метода IElement.edit.

    Для получения или изменения значения после редактирования используйте UIEditEvent.value.

    По завершении метода результат редактирования UIEditEvent.value будет подставлен в IElement.value.

    Так как редактирование завершено вызов UIEditEvent.stop игнорируется.

    На данные (если элемент - наследник IDataElement) возвращаемое значение никак не влияет. Если вы хотите изменить данные элемента вызывайте метод this.setData(...).

    ПРИМЕР

    export var form: IForm = <IForm>{
         type: 'IForm',
         name: "emptyForm",
         ...
         elements: [
             <IElement> {
                 type: 'IElement',
                 name: 'elem',
                 async onAfterEdit(editEvent:UIEditEvent, form: IForm, elem: IElement, item:IElement): Promise<void> {
                     editEvent.value = 'prefix-' + editEvent.value;
                 }
             }
         ],
    }
    

    Перед выполнением метода генерируется событие afterEdit.

    Метод не вызывается, если в методе onBeforeEdit() вызван UIEditEvent.stop.

    Parameters

    Returns Promise<void>

onAfterLoad

  • Этот метод вызывается после загрузки элемента, но до установки данных, для каждого элемента формы.

    ПРИМЕР

    export var form: IForm = <IForm>{
         type: 'IForm',
         name: "emptyForm",
         caption: "Пустая форма",
         ...
         elements: [],
         async onAfterLoad(event: UILoadEvent, form: IForm, elem: IElement): Promise<void> {
             console.log(`Форма ${form.name} после загрузки`);
         }
    }
    

    Перед выполнением метода генерируется событие afterLoad.

    Метод не вызывается, если в методе IElement.onBeforeLoad или событии IElementEvents.beforeLoad вызвали UILoadEvent.stop.

    Parameters

    Returns Promise<void>

onAfterSetData

onBeforeEdit

  • Этот метод вызывается перед редактированием элемента в результате вызова метода IElement.edit.

    Для получения значения до изменения используйте UIEditEvent.value.

    Для отмены редактирования выполните UIEditEvent.stop.

    ПРИМЕР:

    export var form: IForm = <IForm>{
         type: 'IForm',
         name: "emptyForm",
         ...
         elements: [
             <IElement> {
                 type: 'IElement',
                 name: 'elem',
                 async onBeforeEdit(editEvent:UIEditEvent, form: IForm, elem: IElement, item:IElement): Promise<void> {
                     console.log(`Значение перед редактированием: ${editEvent.value}`);
                     if (editEvent.value === '') {
                         editEvent.stopPropagation();//Отменить редактирование
                     }
                 }
             }
         ],
    }
    

    Перед выполнением метода генерируется событие beforeEdit.

    Parameters

    Returns Promise<void>

onBeforeLoad

  • Этот метод вызывается перед загрузкой элемента, для каждого элемента формы.

    ПРИМЕР

    export var form: IForm = <IForm>{
         type: 'IForm',
         name: "emptyForm",
         caption: "Пустая форма",
         ...
         elements: [],
         async onBeforeLoad(event: UILoadEvent, form: IForm, elem: IElement): Promise<void> {
             console.log(`Форма ${form.name} перед загрузкой`);
         }
    }
    

    Перед выполнением метода генерируется событие IElementEvents.beforeLoad.

    Если вы хотите получить данные, переданные в событие onBeforeLoad, или хотите остановить загрузку элемента, используйте объект event: UILoadEvent, соответственно UILoadEvent.data и UILoadEvent.stop.

    Parameters

    Returns Promise<void>

onBeforeSetData

  • Этот метод вызывается перед установкой данных элемента.

    ПРИМЕР

    export var form: IForm = <IForm>{
         type: 'IForm',
         name: "emptyForm",
         caption: "Пустая форма",
         ...
         elements: [],
         async onBeforeSetData(event: UISetDataEvent, form: IForm, elem: IDataElement): Promise<void> {
             console.log(`Форма ${form.name} перед установкой данных`);
         }
    }
    

    Перед выполнением метода генерируется событие IDataElementEvents.beforeSetData.

    Если внутри метода вызвать UISetDataEvent.stop, то установка данных для элемента прекратится.

    Parameters

    Returns Promise<void>

onBlur

  • Метод вызывается при потере фокуса элементом в следующих случаях:

    • при клике мыши на другом элементе (если на другом элементе установлено свойство tabindex),
    • при переключении между элементами с помощью клавиатуры,
    • при вызове метода IElement.blur.

    Перед выполнением метода генерируется событие IElementEvents.blur.

    Сначала происходит погружение от элемента ко всем подэлементам, т.е. метод onBlur вызывается сначала у элемента, потом по всей иерархии вложенных элементов с фокусом. Затем всплытие от вложенного элемента с фокусом к элементу. При всплытии метод onBlur не вызывается.

    Parameters

    Returns Promise<void>

onClick

  • Этот метод вызывается при клике мыши по элементу.

    ПРИМЕР

    export var sendButton: IElement = <IElement>{
         type: 'IElement',
         name: 'elem',
         ...
         async onClick(event: UIMouseEvent, form: IForm, elem: IElement, item: IElement: Promise<void> {
             console.log(`Клик по элементу  ${elem.name}!`);
             return;
         }
    }
    

    Перед выполнением метода генерируется событие click.

    Parameters

    Returns Promise<void>

onDblClick

  • Этот метод вызывается при двойном клике мыши по элементу.

    ПРИМЕР

    export var sendButton: IElement = <IElement>{
         type: 'IElement',
         name: 'elem',
         ...
         async ondblClick(event: UIMouseEvent, form: IForm, elem: IElement, item: IElement: Promise<void> {
             console.log(`Двойной клик по элементу  ${elem.name}!`);
             return;
         }
    }
    

    Перед выполнением метода генерируется событие dblclick.

    Parameters

    Returns Promise<void>

onFocus

  • Фокус на IElement появляется при клике и при навигации клавишами, только если установлено свойство tabindex, кроме IElements, являющихся подэлементом IList, ITable. Для них фокус если IList и ITable с tabindex.

    Метод вызывается при фокусе на элементе в следующих случаях:

    • при клике мыши (если установлено свойство tabindex),
    • при переключении между элементами с помощью клавиатуры (если установлено свойство tabindex),
    • при вызове метода IElement.focus.

    Перед выполнением метода генерируется событие IElementEvents.focus.

    Сначала происходит погружение от формы к элементу, т.е. метод onFocus вызывается сначала у формы, потом по всей иерархии вложенных элементов. Затем всплытие от элемента к форме. При всплытии метод onFocus не вызывается.

    Parameters

    Returns Promise<void>

onKeyDown

  • Метод вызывается при нажатии клавиши на элементе, на котором установлен фокус (IElement.focus):

    Перед выполнением метода генерируется событие IElementEvents.keydown.

    Сначала происходит погружение от формы к элементу с фокусом, т.е. метод onKeyDown вызывается сначала у формы, потом по всей иерархии вложенных элементов до элемента с фокусом. Затем всплытие от элемента с фокусом к форме. При всплытии метод onKeyDown не вызывается.

    Parameters

    Returns Promise<void>

onKeyUp

  • Метод вызывается при отпускании клавиши на элементе, на котором установлен фокус (IElement.focus):

    Перед выполнением метода генерируется событие IElementEvents.keyup.

    Сначала происходит погружение от формы к элементу с фокусом, т.е. метод onKeyUp вызывается сначала у формы, потом по всей иерархии вложенных элементов до элемента с фокусом. Затем всплытие от элемента с фокусом к форме. При всплытии метод onKeyUp не вызывается.

    Parameters

    Returns Promise<void>

removeClass

  • removeClass(className: string): void
  • Удаляет класс из HTML элемента.

    Parameters

    • className: string

    Returns void

removeElement

  • Удаляет элемент из группы. Причем, элемент, опреденный в самой группе или в предке, указанном в свойстве ancestor.

    Parameters

    • name: string

    Returns Promise<IElement<IElementEvents>>

removeStyle

  • removeStyle(property: string): void
  • Удаляет стиль из HTML элемента

    Parameters

    • property: string

    Returns void

setData

  • setData(data: object): Promise<any>
  • Устанавливает данные элементу, в том числе, всем подэлементам. Если у элемента задано свойство 'bindingProperty', тогда будут установленны данные соответствующие этому свойству.

    ПРИМЕР

    export var dataElem: IDataElement = <IDataElement>{
        type: 'IDataElement',
        name: 'dataElement',
        bindingProperty: "firstName"
    }
    ...
    (async function setData(){
         var elem = AppManager.activeForm.getElement("dataElement");
         await elem.setData({firstName: "Иван"});//во внутреннем свойстве elem._data сохранены данные "Иван".
    })();
    

    Parameters

    • data: object

    Returns Promise<any>

    Возвращаются данные, которые установлены элементу.

stopEdit

  • stopEdit(): void
  • Останавливает редактирование элемента.

    Returns void

Generated using TypeDoc