AdvancedSelect
==============

.. granite:servercomponent:: /libs/granite/ui/components/foundation/form/advancedselect
   :supertype: /libs/granite/ui/components/foundation/form/field
   :deprecated:

   A component providing a concept of select.
   While :doc:`../select/index` has stricter way to render the options, AdvancedSelect allows you to use any component that is implementing
   :doc:`/jcr_root/libs/granite/ui/components/foundation/clientlibs/foundation/vocabulary/selections` vocabulary.
   This way you can do any visualization imaginable to render the options.

   It satisfies the semantic of :doc:`foundation-advancedselect </jcr_root/libs/granite/ui/components/foundation/clientlibs/foundation/js/advancedselect/index>`.

   It extends :granite:servercomponent:`Field </libs/granite/ui/components/foundation/form/field>` component.

   It has the following content structure:

   .. gnd:gnd::

      [granite:FormAdvancedSelect] > granite:container

      /**
       * The id attribute.
       */
      - id (String)

      /**
       * The class attribute. This is used to indicate the semantic relationship of the component similar to ``rel`` attribute.
       */
      - rel (String)

      /**
       * The class attribute.
       */
      - class (String)

      /**
       * The title attribute.
       */
      - title (String) i18n

      /**
       * The itemscope attribute. As long as this property exists, the attribute is rendered.
       */
      - itemscope (String)

      /**
       * The itemprop attribute.
       */
      - itemprop (String)

      /**
       * The name that identifies the field when submitting the form.
       */
      - name (String)

      /**
       * ``true`` to generate the `SlingPostServlet @Delete <http://sling.apache.org/documentation/bundles/manipulating-content-the-slingpostservlet-servlets-post.html#delete>`_ hidden input based on the name.
       */
      - deleteHint (Boolean) = true

      /**
       * Indicates if the field is mandatory to be filled.
       */
      - required (Boolean)

      /**
       * Indicates if the user is able to select multiple options.
       */
      - selectionMode (String) = 'multiple' < 'single', 'multiple'

      /**
       * The :doc:`[data-foundation-mode-group] </jcr_root/libs/granite/ui/components/foundation/clientlibs/foundation/vocabulary/mode>` of this component.
       */
      - 'foundation-mode-group' (String)

      /**
       * The name of the validator to be applied. E.g. ``foundation.jcr.name``.
       * See :doc:`validation </jcr_root/libs/granite/ui/components/foundation/clientlibs/foundation/js/validation/index>` in Granite UI.
       */
      - validation (String) multiple

      /**
       * The :doc:`[data-foundation-validation-ui] </jcr_root/libs/granite/ui/components/foundation/clientlibs/foundation/vocabulary/validation>` of this component.
       */
      - 'foundation-validation-ui' (String)

      /**
       * 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 :doc:`foundation-advancedselect </jcr_root/libs/granite/ui/components/foundation/clientlibs/foundation/js/advancedselect/index>`.
       */
      + toolbar

   Example::

      + selecttemplate
        - foundation-validation-ui = "none"
        - name = "template"
        - required = true
        - selectionMode = "single"
        - sling:resourceType = "granite/ui/components/foundation/form/advancedselect"
        + layout
          - name = "foundation-layout-card"
          - selectionMode = true
        + datasource
          - itemResourceType = "cq/gui/components/siteadmin/admin/templateoption"
          - path = "${requestPathInfo.suffix}"
          - sling:resourceType = "cq/gui/components/siteadmin/admin/templatedatasource"

Components:

.. toctree::
   :glob:

   */index