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
...
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
phone:
label: Phone
$type: textField
required: true |
The properties
list here is defined with the YAML list syntax.
...
Form properties
properties | required A list List of editor property definition items (typically, a list of fields). See Field definition for more information. |
| optional, default is Defines the form layout. The value must be a fully qualified class name and be a subtype of See Form layout Layout types for more information. |
Available field definition classes
...
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.
...
Layout types
$type | class |
---|---|
|
|
defaultEditorActionLayout | info.magnolia.ui.dialog.layout.DefaultEditorActionLayoutDefinition |
|
|
| info.magnolia.ui.framework.layout.HorizontalLayoutDefinition |
stacked | info.magnolia.ui.framework.layout. |
...
StackedLayoutProducer | |
|
|
...
|
Default layout
With
Javadoc resource link | ||||
---|---|---|---|---|
|
From Magnolia 6.2.1, FormLayoutDefinition
has replaced the deprecated PlainFormLayoutDefinition
as the default layout.
Tabbed layout
With
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.
The fully qualified class name of the tabbed layout is info.magnolia.ui.framework.layout.TabbedLayoutDefinition
. If the definition class is annotated with
Javadoc resource link | |
---|---|
|
|
|
$type
alias tabbedLayout
instead.Code Block | ||||||
---|---|---|---|---|---|---|
| ||||||
layout: $type: tabbedLayout tabs: personal: fields: - name: salutation - name: firstName - name: lastName details: fields: - name: email - name: phone |
Horizontal layout
With
Javadoc resource link | ||||
---|---|---|---|---|
|
spacing
property to false
.Code Block | ||||||
---|---|---|---|---|---|---|
| ||||||
layout: $type: horizontal fields: - name: salutation $type: textField label: Salutation - addressname: firstName fields$type: textField label: First name - name: lastName $type: textField label: streetAddress Last name |
Stacked layout
With
Javadoc resource link | ||||
---|---|---|---|---|
|
Code Block | ||||||
---|---|---|---|---|---|---|
| ||||||
layout: $type: stacked fields: - name: postalCode salutation $type: textField label: Salutation - name: firstName $type: citytextField label: First name - name: country: lastName $type: textField label: Last name |
Declarative layout
With the declarative layout
Javadoc resource link | ||||
---|---|---|---|---|
|
info.magnolia.ui.framework.layout.DeclarativeLayoutDefinition
. If the definition class is annotated with info.magnolia.ui.framework.layout.LayoutType, you can use the $type
alias declarativeLayout
instead.Code Block | ||||||
---|---|---|---|---|---|---|
| ||||||
layout: $type: declarativeLayout template: /contacts/layouts/edit-contact.html |
...
Info |
---|
If |
Action layout
With
Javadoc resource link | ||||
---|---|---|---|---|
|
To learn about the layout properties, see footerLayout
.