Slider field
info.magnolia.ui.field.SliderFieldDefinition renders a horizontal bar that allows you to set a numeric value within a defined range by dragging a handle with the mouse. The value appears as you move the handle.
Slider field definition is part of the Magnolia 6 UI framework. The
fully qualified class name is
This field has been introduced since Magnolia 6.2. There is no corresponding implementation in the Magnolia 5 UI framework. |
Example definition
slider:
$type: sliderField
label: Percentage
defaultValue: 50
stepSize: 5
displayStepSize: 25
valueFormat: PERCENTAGE
You can preview this example in the |
Field properties
Field-specific properties
Property | Description |
---|---|
|
optional Title displayed above the slider. The value is i18n-able. |
|
optional, default is Minimum value of the slider range. |
|
optional, default is Maximum value of the slider range. |
|
optional, default is Size of increments by which the slider handle moves. For this to work,
the value must be greater than |
|
optional, default is Size of increments by which values appear on the slider. For this to work, the value must be greater than or equal to |
|
optional, default is Value format can be |
Common simple field properties
Property | Description | ||||
---|---|---|---|---|---|
|
required Name of the field definition item. Derived from the configured node name. Use alphanumeric characters without spaces. |
||||
|
required (unless Type of the field definition item. The value must be a fully qualified
class name and a subtype of |
||||
|
You can use this as a shortcut for Example class annotation
See Field types for possible values. |
||||
|
required, default is Data type of the field. Use the fully qualified class name. See PropertyType for possible values. A default type is typically hard-coded in each definition class. You only need to add this property if you want to override the default implementation.
|
||||
|
optional Converts values between the presentation (UI) and model (stored data). The property must extend
|
||||
|
optional, default is translated Message shown when there is an error in the conversion process. The value can be literal or a key of a message bundle. |
||||
|
optional Pre-filled default value displayed in the field. The value can be overwritten by the user. Use alphanumeric characters.
|
||||
|
optional Help text displayed when the user clicks the help icon. The value can be literal or a key of a message bundle. |
||||
|
optional Defines the factory class that initializes and builds the Vaadin form field. The default factory class depends on the particular field. The value must be a fully qualified class name and a subtype of
|
||||
|
optional Defines the binder class that applies configuration parameters from the field. |
||||
|
optional, default is Enables i18n
authoring support, which allows editors to write foreign-language or
regionally targeted content. A two-letter language identifier ( |
||||
|
optional Field label displayed to editors. The value can be literal or a key of a message bundle. If you do not provide the property, Magnolia will fall back to a generated i18n key. If you do not want to have any label, set the property to an empty
string such as |
||||
|
optional, default is Makes the field uneditable. |
||||
|
optional, default is Makes the field required. When
|
||||
|
optional, default is translated Error message shown when |
||||
|
optional Additional style information for an editor property definition item applied to the element when the form is rendered. The value can be a CSS class or a list of CSS classes separated by white spaces. The style name will be rendered as an HTML class name, which can be used in a CSS definition.
The class name is added to the field by calling the Vaadin method
|
||||
|
optional List of field validator definition items. Any value must be a subtype of
See Field validators for more information. |