таблица с двумя колонками - name и value, используется для отображения и изменения свойств и настроек.
Компонент особенно удобен для создания страниц для конфигурации интерфейса и визардов. Во вторую колонку вы можете добавить редактор в зависимости от типа данных. Подробнее читайте в описательной документации property.
var property = webix.ui({
view:"property",
id:"sets",
width:300,
elements:[
{ label:"Layout", type:"label"},
{ label:"Data url", type:"text", id:"url"},
{ label:"Data type", type:"select", options:["json","xml","csv"], id:"type"},
{ label:"Use JSONP", type:"checkbox", id:"jsonp"}
]
});
| adjust | подстраивает размеры компонента под размеры HTML-контейнера |
| attachEvent | задает обработчик внутреннего события компонента |
| bind | связывает данные компонентов |
| blockEvent | временно блокирует вызов ВСЕХ событий вызывающего объекта |
| callEvent | вызывает внутреннее событие компонента |
| clear | удаляет все данные из элементов property |
| customize | переопределяет свойство 'type' |
| define | переопределяет одну или несколько настроек компонента |
| destructor | разрушает компонент |
| detachEvent | удаляет обработчик события (который был задан ранее методом attachEvent) |
| disable | блокирует компонент (он становится серым, клики по нему не срабатывают) |
| edit | включает режим редактирования для выбранного элемента |
| editCancel | заканчивает редактирование и закрывает всё открытые радакторы (компонент остается редатируемым) |
| editNext | закрывает текущий редактор и открывает редактор в соседней ячейке |
| editStop | заканчивает редактирование и закрывает все открытые редакторы (компонент остаётся доступным для редактирования) |
| enable | делает активным ранее заблокированный компонент |
| focusEditor | перемещает фокус на активный редактор |
| getChildViews | возвращает внутренние компоненты |
| getEditState | возвращает объект активного редактора |
| getEditor | возвращает объект редактора |
| getEditorValue | возвращает значение активного (открытого в настоящий момент) редактора |
| getFormView | возвращает объект формы, которой принадлежит компонент |
| getItem | возвращает объект с данными элемента property по его ID |
| getItemNode | возвращает HTML-контейнер элемента данных компонента |
| getNode | возвращает HTML-элемент компонента |
| getParentView | возвращает родительский компонент |
| getScrollState | возвращает позицию скролла |
| getTopParentView | возвращает самого верхнего родителя |
| getValues | возвращает данные из элементов property |
| hasEvent | проверяет, есть ли у компонента обработчики указанного события |
| hide | скрывает компонент |
| isEnabled | проверяет, активен или заблокирован компонент |
| isVisible | проверяет, виден ли компонент |
| load | загружает данные из внешнего источника данных |
| locate | возвращает id элемента, для которого произошло нативное событие HTML |
| mapEvent | направляет события от одного компонента к другому |
| parse | загружает данные, доступные на клиенте |
| queryView | возвращает внутренние компоненты, которые удовлетворяют указанному условию |
| refresh | перерисовывает весь компонент или один элемент |
| registerType | добавляет новый редактор для элементов property |
| render | отрисовывает на экране компонент или его элемент |
| resize | перерисовывает компонент после изменения размеров |
| scrollTo | прокручивает содержимое компонента до определенной позиции |
| setValues | заполняет поля формы/тулбара/property sheet |
| show | делает компонент видимым |
| showItem | прокручивает содержимое property до указанного элемента |
| sync | позволяет синхронизировать данные двух DataCollection (полностью или с фильтрацией) |
| unbind | отменяет связывание компонентов |
| unblockEvent | отменяет блокировку событий, которая была вызвана командой 'blockEvent' |
| updateItem | работает как метод refresh, перерисовывает весь компонент |
| validateEditor | проверяет данные в открытом на данный момент редакторе |
| onAfterContextMenu | срабатывает после вызова контекстного меню |
| onAfterEditStart | срабатывает после начала редактирования (редактор открыт и готов к вводу информации) |
| onAfterEditStop | срабатывает после завершения редактирования |
| onAfterLoad | срабатывает после завершения загрузки данных |
| onAfterRender | выполняется сразу после рендеринга компонента |
| onAfterScroll | срабатывает после прокрутки содержимого компонента webix |
| onBeforeContextMenu | срабатывает перед вызовом контекстного меню |
| onBeforeEditStart | срабатывает перед началом редактирования |
| onBeforeEditStop | срабатывает перед завершением редактирования |
| onBeforeLoad | запускается непосредственно перед началом загрузки данных |
| onBeforeRender | происходит непосредственно перед отрисовкой компонента |
| onBindRequest | срабатывает, когда компонент готов получить данные из главного компонента |
| onBlur | срабатывает при смещении фокуса за пределы компонента |
| onCheck | срабатывает после клика по чекбоксу |
| onDestruct | происходит, когда компонент был разрушен деструктором |
| onEnter | срабатывает после нажатия клавиши Enter |
| onFocus | срабатывает после смещения фокуса на компонент |
| onItemClick | срабатывает после клика по элементу компонента |
| onItemDblClick | срабатывает после двойного клика по элементу компонента |
| onItemSingleClick | позволяет различать события одиночного и двойного клика |
| onKeyPress | срабатывает после того, как пользователь нажал клавишу (для компонента, на котором сейчас фокус) |
| onLiveEdit | срабатывает, когда данные были изменены в редакторе |
| onLoadError | срабатывает при возникновении ошибки во время загрузки данных (невалидный ответ с сервера) |
| onLongTouch | срабатывает после того, как пользователь на достаточно долгое время задержит палец на экране (для устройств с сенсорным экраном) |
| onMouseMove | срабатывает при наведении мыши на указанный компонент |
| onMouseMoving | срабатывает при наведении указателя мыши на компонент |
| onMouseOut | срабатывает, когда курсор мыши убирается с указанного элемента |
| onSwipeX | срабатывает по горизонтальному свайпу |
| onSwipeY | срабатывает по вертикальному свайпу |
| onTimedKeyPress | срабатывает через некоторое время после нажатия клавиши в текстовом поле |
| onTouchEnd | срабатывает после завершения события touch |
| onTouchMove | срабатывает по время движения пальца по сенсорному экрану |
| onTouchStart | срабатывает после touch-события в компоненте webix |
| onViewResize | срабатывает после того, как пользователь изменил размер компонента с помощью компонента resizer |
| onViewShow | срабатывает, когда компонент появляется (вызов метода show()) |
| animate | определяет анимацию для показа компонента в Multiview |
| autoheight | подстраивает высоту компонента под его содержимое |
| borderless | скрывает или показывает границы компонента |
| complexData | обеспечивает корректную обработку вложенных объектов |
| container | HTML-контейнер (или его ID), внутри которого компонент должен быть инициализирован |
| css | имя CSS-класса, который будет присвоен HTML-элементу компонента, или объект со стилями |
| data | данные для компонента (массив, типизированный массив, XML или CSV) |
| datatype | тип загружаемых данных |
| disabled | блокирует или разблокирует компонент |
| editValue | определяет какие поля элемента данных доступны для редактирования (применяется если в ячейке / строке данные из нескольких полей) |
| editable | включает / выключает редактирование данных в компоненте |
| editaction | определяет действие, по которому открывается редактор |
| elements | массив элементов property |
| form | форма для редактирования данных компонента |
| gravity | задает удельный (относительный) размер компонента |
| height | задает высоту компонента |
| hidden | скрывает компонент после его инициализации |
| id | ID компонента |
| item | аналог свойства type |
| keyPressTimeout | задержка между нажатием клавиши и обработчиком |
| map | определяет отображение данных |
| maxHeight | задает максимальную высоту компонента |
| maxWidth | задает максимальную ширину компонента |
| minHeight | задает минимальную высоту компонента |
| minWidth | задает минимальную ширину компонента |
| mouseEventDelay | задержка между реальным действием мыши и вызовом связанных событий |
| nameWidth | устанавливает ширину первой колонки (колонка с названиями элементов) |
| on | позволяет присоединять обработчики к внутренним событиям компонента |
| onClick | присоединяет обработчик клика для частей компонента с указанным классом CSS |
| onContext | свойство, используемое для определения пользовательских обработчиков контекстного клика (клика правой кнопкой мыши) для элементов в ячейках DataTable
|
| onDblClick | обрабатывает двойные клики по областям и элементам компонентов (по названию их CSS-классов) |
| onMouseMove | обрабатывает событие mousemove для элементов компонента с указанным классом CSS |
| scroll | включает/отключает полосу прокрутки |
| scrollSpeed | время, в течение которого компонент прокручивается до указанной позиции (в миллисекундах) |
| template | template компонента |
| tooltip | задает тултип, который появится при наведении курсора на элемент |
| type | позволяет задать внутреннюю высоту элементов |
| url | путь к данным, которые загрузятся в компонент сразу после инициализации |
| width | задает ширину компонента |
| $getSize | возвращает текущий размер компонентов |
| $height | текущая высота компонента |
| $scope | область имен для событий и методов |
| $setNode | определяет HTML-элемент компонента |
| $setSize | задает размеры компонента |
| $skin | вызывается после применения скина |
| $tooltipIn | показывает тултип |
| $tooltipMove | определяет поведение тултипа в момент, когда курсор перемещается над компонентом или HTML-областью |
| $tooltipOut | определяет поведение тултипа в момент, когда курсор выходит за пределы компонента или HTML-области |
| $view | возвращает HTML-элемент компонента |
| $width | текущая ширина компонента |
| config | все настройки, заданные при инициализации компонента |
| name | возвращает имя компонента (свойство только для чтения) |
| on_click | переопределяет обработку кликов по элементам компонента |
| on_context | свойство, используемое для определения пользовательских обработчиков клика правой кнопкой мыши для элементов в компонентах |
| on_dblclick | определяет обработчики для двойных кликов по элементам компонентов (по названию их CSS-класса) |
| on_edit | набор флагов, которые определяют, какие из типов элементов нередактируемые, а также используется для изменения типа редакторов |
| on_mouse_move | добавляет обработчик для события mousemove над элементами компонентов (по названию их CSS-класса) |
| on_render | используется для отрисовки пользовательских редакторов |
| type | текущий набор методов и свойств, которые определяют вид и содержимое компонента |