AdvancedSelectΒΆ

/libs/granite/ui/components/coral/foundation/form/advancedselect

A component providing a concept of select. While Select has stricter way to render the options, AdvancedSelect allows you to use any component that is implementing foundation-selections vocabulary. This way you can do any visualization imaginable to render the options.

It satisfies the semantic of foundation-advancedselect.

It extends Field component.

It has the following content structure:

granite:FormAdvancedSelect
  1. granite:commonAttrs
  2. granite:renderCondition
namestring

The name that identifies the field when submitting the form.

deleteHintboolean
  1. true

true to generate the SlingPostServlet @Delete hidden input based on the name.

requiredboolean

Indicates if the field is mandatory to be filled.

validationstring
multiple

The name of the validator to be applied. E.g. foundation.jcr.name. See validation in Granite UI.

maximizedboolean

Make the element maximized to fill the available space.

toolbar

The toolbar component of the AdvancedSelect. The toolbar can be any component. It is usually used to render the .foundation-advancedselect-navigator and .foundation-advancedselect-status of foundation-advancedselect.

field

The actual field component that implements foundation-selections.

Example

Given the example below, the options are rendered using masonry component:

+ myselect
  - sling:resourceType = "granite/ui/components/coral/foundation/form/advancedselect"
  - name = "myselect"
  + field
    - sling:resourceType = "granite/ui/components/coral/foundation/masonry"
    - selectionCount = "single"
    - selectionMode = true
    + datasource
      - sling:resourceType = "my/datasource"

Components: