WizardΒΆ
-
/libs/granite/ui/components/foundation/layouts/wizard
The wizard layout.
It is implementing foundation-wizard vocabulary.
The wizard is designed to expand to the container size, thus it is required to be contained in the container that has a size.
It has the following content structure at the layout resource:
- granite:LayoutsWizard
-
formModestring
- default
- edit
The mode of the form. This property only makes sense when the main component is a form.
- default
- The form is shown in readonly mode, where the fields are optimized for reading, instead of editing.
- edit
- The form is shown in edit mode, where the fields are ready to handle user inputs.
-
formStylestring
- vertical
- vertical
- aligned
The layout style of the form. This property only makes sense when the main component is a form.
- vertical
- The form fields (and their labels) are laid out in vertical manner.
- aligned
- The each form field is laid out side-by-side with its label.
-
formModestring
Each wizard step can be any component, and specified using ItemDataSource. It also needs at very least satisfies the following content structure:
- granite:LayoutsWizardStep
- jcr:titlestring
- mandatory
- i18n
The wizard step title.
-
layoutConfig
- granite:LayoutsWizardStepLayoutconfig
The item specific config for the layout.
- granite:LayoutsWizardStepLayoutconfig
-
validationboolean
- true
false
to skip validation for this particular step. Otherwise the validation is performed when step change is about to occur.
-
validationboolean
Example:
+ mywizard - sling:resourceType = "granite/ui/components/foundation/form" + layout - sling:resourceType = "granite/ui/components/foundation/layouts/wizard" + items + step1 - jcr:title = "Step 1" - sling:resourceType = "granite/ui/components/foundation/container" + step2 - jcr:title = "Step 2" - sling:resourceType = "granite/ui/components/foundation/container" + layoutConfig - validation = "false"