DEPRECATED
This field definition has been deprecated since Magnolia 6.0. It is part of the Magnolia 5 UI framework.
For the updated implementation, see Field definition for Magnolia 6 UI instead.
A field is an HTML form element that allows a user to perform a task such as enter text, upload an image or select a date. Magnolia ships with a number of fields that should fulfill most needs.
Example
This form has four text fields and one checkbox field:
To add a field on your form, define the field inside a tab (see example below). At minimum, a field definition must contain a class
or a fieldType
property which tells Magnolia what type of field it should render. Set the property value to a valid field definition class name (for class
) or to a valid field alias name (for fieldType
). All fields support further common properties for defining things such as labels and descriptions.
form: tabs: - name: tabMain label: Text fields: - name: title fieldType: text label: pages.pageProperties.title.label description: pages.pageProperties.title.description i18n: true required: true type: string
Node name | Value |
---|---|
form | |
tabs | |
tabMain | |
fields | |
title | |
fieldType | text |
description | pages.pageProperties.title.description |
i18n | true |
label | pages.pageProperties.title.label |
required | true |
type | String |
See the complete form definition in Git.
Common field properties
You can use these properties with any field unless specified otherwise.
Field types
$type | class |
---|---|
checkBoxField | info.magnolia.ui.field.CheckBoxFieldDefinition |
checkBoxGroupField | info.magnolia.ui.field.CheckBoxGroupFieldDefinition |
codeField | info.magnolia.ui.field.CodeFieldDefinition |
|
|
|
|
dateField | info.magnolia.ui.field.DateFieldDefinition |
hiddenField | info.magnolia.ui.field.HiddenFieldDefinition |
|
|
listSelectField | info.magnolia.ui.field.ListSelectFieldDefinition |
|
|
passwordField | info.magnolia.ui.field.PasswordFieldDefinition |
radioButtonGroupField | info.magnolia.ui.field.RadioButtonGroupFieldDefinition |
richTextField | info.magnolia.ui.field.RichTextFieldDefinition |
sliderField | info.magnolia.ui.field.SliderFieldDefinition |
staticField | info.magnolia.ui.field.StaticFieldViewDefinition |
switchableField | info.magnolia.ui.field.SwitchableFieldDefinition |
textField | info.magnolia.ui.field.TextFieldDefinition |
tokenField | info.magnolia.ui.field.TokenFieldDefinition |
twinColSelectField | info.magnolia.ui.field.TwinColSelectFieldDefinition |
Your Magnolia installation may contain more fields depending on the installed modules.
Transformer classes
- For simple fields such as Text and Date:
info.magnolia.ui.form.field.transformer.basic.BasicTransformer
- For composite fields:
info.magnolia.ui.form.field.transformer.composite.CompositeTransformer
For switchable fields:
info.magnolia.ui.form.field.transformer.composite.SwitchableTransformer
For multivalue fields:
info.magnolia.ui.form.field.transformer.multi.MultiValueTransformer
Other available transformer classes:
info.magnolia.ui.form.field.transformer.composite.DelegatingCompositeFieldTransformer
info.magnolia.ui.form.field.transformer.multi.DelegatingMultiValueFieldTransformer
info.magnolia.ui.form.field.transformer.composite.NoOpCompositeTransformer
info.magnolia.ui.form.field.transformer.multi.MultiValueJSONTransformer
info.magnolia.ui.form.field.transformer.multi.MultiValueChildrenNodeTransformer
info.magnolia.ui.form.field.transformer.multi.MultiValueChildNodeTransformer
info.magnolia.ui.form.field.transformer.multi.MultiValueSubChildrenNodeTransformer