Form Table. Базовые компоненты Extension Library

Логичным продолжением повествования об отображении данных будет...их заполнение и отображение для одного документа.

1. Application Layout

2. Navigator

3. Data View

4. Form Table (+Form Layout Column, Form Layout Row)

5. Dialog (+ Dialog Content, Dialog Button Bar)

6. Tooltip Dialog

--- Дополнительно ---

7. Widget Container

8. Bread Crumbs


Form Table
Компонент для создания/изменения данных документа. Больше именно для этих нужд, потому как отображение данных можно организовать и более симпатичными средствами. В целом, конечно, не обязательно, можно использовать и Form Table. После перетаскивания компонента из палитры он выглядит следующим образом.

Основные свойства:

basics

• formTitle - название формы
• formDescription - ее описание
• disableErrorSummary - компонент может отображать ошибки валидации полей стандартным образом. Это свойство может отключать общее сообщение о суммарных ошибках
• disableRowError - свойство может отключать отображение ошибки для каждой строки с полем
• labelWidth - размер названия поля по-умолчанию

format

• disableRequiredMarks - отключение символов обязательности заполнения поля ("*"), если в свойствах компонента, отвечающего за его заполнение, стоит признак обязательности
• labelPosition - расположение названия поля относительного его самого по-умолчанию: над или сбоку поля.

В нижней части компонента (footer) можно расположить кнопки действий, поместив их в панель (Panel). С расположение же самих полей связан другой компонент Extension Library - Form Layout Row.

Form Layout Row

Это строка непосредственно под поле. Располагается только внутри компонента Form Table.
Общий вид:

Последний фасет для вставки компонента, отвечающего за ввод значений

Основные свойства:
basics

• for - id компонента для ввода значения. Доступно для выбора, когда компонент добавлен в фасет
• label - название поля. Имеется фасет для замещения
• labelWidth - размер поля, перекрывает значение по-умолчанию, выставляемое в Form Table

format

• labelPosition - расположение названия поля относительного его самого. Перекрывает значение по-умолчанию, выставляемое в Form Table

Form Layout Column

Компонент, позволяющий разбивать поля для ввода по колонкам. Иерархия компонентов для представления формы ввода, с использованием Form Layout Column, выглядит следующим образом:

Form Table

   -> Form Layout Column

       -> Form Layout Row

Demo
Демо-приложение для демонстрации работы Form Table (правда без Form Layout Column) обновлено.