Page History
...
| Info |
|---|
This form definition is part of the Magnolia 6 UI framework. The fully qualified class name is If you work with the Magnolia 5 UI framework, see Form definition for Magnolia 5 UI instead. |
| Table of Contents |
|---|
Example form definition
| Code Block | ||
|---|---|---|
| ||
form:
properties:
salutation:
label: Salutation
$type: textField
i18n: true
firstName:
label: First name
$type: textField
required: true
lastName:
label: Last name
$type: textField
required: true
email:
label: Email
$type: textField
required: true
validators:
email:
$type: emailValidator |
...
| Tip |
|---|
When a property type is defined as a list in the corresponding Java class, you can use the YAML map syntax or list syntax. Map2BeanTransformer converts YAML in both cases correctly. See YAML: Defining a list property via YAML map or list syntax. |
Form properties
properties | required A list of editor property definition items (typically, a list of fields). See Field definition for more information. |
|
Available field definition classes
| Include Page | ||||
|---|---|---|---|---|
|
Form layout
Plain layout
With the plain layout, it is not possible to configure anything. Use this layout class when there is no need for customization.
The fully qualified class name of the plain layout is info.magnolia.ui.framework.layout.PlainFormLayoutDefinition. If the definition class is annotated with info.magnolia.ui.framework.layout.LayoutType, you can use the $type alias plain instead.
Tabbed layout
With the tabbed layout, you can add or remove tabs and fields. It is not possible to change how any tabs and fields are rendered. Use this layout class when the need for customization is minimal.
...
| Code Block | ||||||
|---|---|---|---|---|---|---|
| ||||||
layout:
$type: tabbedLayout
tabs:
personal:
fields:
- name: salutation
- name: firstName
- name: lastName
details:
fields:
- name: email
- name: phone
address:
fields:
- name: streetAddress
- name: postalCode
- name: city
- name: country |
Declarative layout
With the declarative layout, you can create form entries in an arbitrary Vaadin component container using the Vaadin declarative syntax. Use this layout class for full customization.
...
Overview
Content Tools