Magnolia 5.7 reached extended end of life on May 31, 2022. Support for this branch is limited, see End-of-life policy. Please note that to cover the extra maintenance effort, this EEoL period is a paid extension in the life of the branch. Customers who opt for the extended maintenance will need a new license key to run future versions of Magnolia 5.7. If you have any questions or to subscribe to the extended maintenance, please get in touch with your local contact at Magnolia.

The form definition defines the tabs and fields in a dialog.

Form properties

Simple form definition with two tabs and Title (plain text), Text (rich text) and a link field to link to an asset from DAM.

<my-module>/dialogs/components/<dialog name>.yaml
form:
  tabs:
    - name: tabText
      label: Text
      fields:
        - name: title
          fieldType: text
          label: Title
        - name: textEditor
          fieldType: richText
          label: Text editor
    - name: tabImage
      label: Image
      fields:
        - name: image
          fieldType: link
          targetWorkspace: dam
          appName: assets
          identifierToPathConverter:
            class: info.magnolia.dam.app.assets.field.translator.AssetCompositeIdKeyTranslator
          contentPreviewDefinition:
            contentPreviewClass: info.magnolia.dam.app.ui.field.DamFilePreviewComponent
Node nameValue

 
<dialog name>


 
actions


 
form


 
tabs


 
tabText


 
fields


 
title


 
fieldType

text

 
label

Title

 
textEditor


 
fieldType

richText

 
label

Text editor

 
label

Text

 
tabImage


 
fields


 
image


 
fieldType

link

 
targetWorkspace

dam

 
appName

assets

 
identifierToPathConverter


 
class

info.magnolia.dam.app.assets.field.translator.AssetCompositeIdKeyTranslator

 
icontentPreviewDefinition


 
class

info.magnolia.dam.app.ui.field.DamFilePreviewComponent

 
label

Image

Nodes and properties:

<dialog name>

required

Arbitrary node name. Typically matches the template it edits. For example the component definition node and dialog definition node for a link component could both be named link. This is not required and one dialog can be used for more than one template.

form

required

Contains the form definition which defines the tabs and fields where content is entered.

tabs

required

Contains the tabs within the form. Every dialog needs at least one tab.

<tab name>

required

The name of the tab. Arbitrary node name. Use a name that describes the content of the tab like imageTab or addressTab.

fields

required

Contains the fields within the tab. See Field definition for more.

<field name>

required

Arbitrary field name. Use a name that describes the field like title or headline.

class

or

fieldType

required

Field definition class (if using class, see Available field definition classes and List of fields for more), or field definition name (if using fieldType). To view the field names, look in the Definitions app.


<other field properties>

optional

See Common field properties for a list of optional properties that can be used with all fields.

required

Each field definition class supports its own properties. See List of fields for properties and example configurations of each field.

label

optional

The tab label. Displays in the tab.


Available field definition classes

fieldTypeclass
textinfo.magnolia.ui.form.field.definition.TextFieldDefinition
richTextinfo.magnolia.ui.form.field.definition.RichTextFieldDefinition
dateinfo.magnolia.ui.form.field.definition.DateFieldDefinition
hiddeninfo.magnolia.ui.form.field.definition.HiddenFieldDefinition
linkinfo.magnolia.ui.form.field.definition.LinkFieldDefinition
codeinfo.magnolia.ui.form.field.definition.CodeFieldDefinition
multiValueinfo.magnolia.ui.form.field.definition.MultiValueFieldDefinition
passwordinfo.magnolia.ui.form.field.definition.PasswordFieldDefinition
selectinfo.magnolia.ui.form.field.definition.SelectFieldDefinition
optionGroupinfo.magnolia.ui.form.field.definition.OptionGroupFieldDefinition
twinColSelectinfo.magnolia.ui.form.field.definition.TwinColSelectFieldDefinition
checkboxinfo.magnolia.ui.form.field.definition.CheckboxFieldDefinition
compositeinfo.magnolia.ui.form.field.definition.CompositeFieldDefinition
switchableinfo.magnolia.ui.form.field.definition.SwitchableFieldDefinition
staticinfo.magnolia.ui.form.field.definition.StaticFieldDefinition
basicUploadinfo.magnolia.ui.form.field.definition.BasicUploadFieldDefinition
damUploadinfo.magnolia.dam.app.ui.field.definition.DamUploadFieldDefinition
collapsibleCompositeinfo.magnolia.editor.app.field.CollapsibleCompositeFieldDefinition
expandingTextinfo.magnolia.editor.app.field.ExpandingTextFieldDefinition

Your Magnolia installation may contain more fields depending on the installed modules. Use the Definitions app to see all available field types.