ShellSearchFormΒΆ

/libs/granite/ui/components/shell/search/form

A form component for the purpose of search rail panel of the CollectionPage.

It has the following content structure:

granite:ShellSearchForm
  1. granite:commonAttrs
  2. granite:container
modeGroupstring

The value of [data-foundation-mode-group] that the search result collection is part of.

targetCollectionstring

The selector to the search result collection.

result
  1. granite:ShellSearchFormResult
mandatory

The config of the search result.

granite:ShellSearchFormResult
views
mandatory

The folder for the available views (i.e. the rendering) of the collection, where each can any component implementing foundation-collection.

At least one view needs to be provided. If there are at least two views, the following properties are needed to be able to switch the view:

icon (String)
The icon of the view.
jcr:title (String)
The title of the view.
src (StringEL)

The URI Template that is returning the HTML response of the new view. It supports the following variables:

offset
The item offset of the current request.
limit
The item limit of the pagination.
actions
  1. granite:ShellSearchFormResultActions

The folder for the actions applicable in the context of the collection.

granite:ShellSearchFormResultActions
selection

The folder for actions applicable during selection mode. (e.g. when one of the collection item is selected)

The action can be any action component such as Button, AnchorButton, Pulldown, Collection.

The actionBar variant of the components above SHOULD be used, unless primary variant is used.

Usually the action is implementing foundation-collection-action, with relScope = item.

Example:

+ /mypage
  - sling:resourceType = "granite/ui/components/shell/collectionpage"
  + rails
    + search
      - sling:resourceType = "granite/ui/components/coral/foundation/panel/railpanel"
      - jcr:title = "Search"
      + items
        + form
          - sling:resourceType = "granite/ui/components/shell/search/form"
          - modeGroup = "cq-sites-search-result"
          - targetCollection = "#cq-sites-search-result"
          + items
            + type
              - sling:resourceType = "granite/ui/components/coral/foundation/form/hidden"
              - name = "type"
              - value = "cq:Page"
            + fulltext
              - sling:resourceType = "granite/ui/components/coral/foundation/form/textfield"
              - fieldLabel = "Keyword"
              - name = "2_fulltext"
            + path
              - sling:resourceType = "granite/ui/components/coral/foundation/form/textfield"
              - fieldLabel = "Directory"
              - name = "3_path"
              - value = "/content"
            + orderby
              - sling:resourceType = "granite/ui/components/coral/foundation/form/hidden"
              - name = "orderby"
              - value = "path"
          + result
            + views
              + card
                - granite:id = "cq-sites-search-result"
                - jcr:title = "Card View"
                - sling:resourceType = "granite/ui/components/coral/foundation/masonry"
                - icon = "viewCard"
                - limit = 20
                - modeGroup = "cq-sites-search-result"
                - size = '${empty requestPathInfo.selectors[2] ? "20" : requestPathInfo.selectors[2]}'
                - src = "/mypage/rails/search/items/form/result/views/card{.offset,limit}.html?${querystring}"
                + datasource
                  - sling:resourceType = "granite/ui/components/coral/foundation/querybuilder/datasource"
                  - itemResourceType = "my/card"
                  - limit = '${empty requestPathInfo.selectors[2] ? "21" : requestPathInfo.selectors[2] + 1}'
                  - offset = "${requestPathInfo.selectors[1]}"
              + list
                - granite:id = "cq-sites-search-result"
                - jcr:title = "List View"
                - sling:resourceType = "granite/ui/components/coral/foundation/table"
                - icon = "viewList"
                - limit = 40
                - modeGroup = "cq-sites-search-result"
                - selectionMode = "row"
                - size = '${empty requestPathInfo.selectors[1] ? "40" : requestPathInfo.selectors[1]}'
                - src = "/mypage/rails/search/items/form/result/views/list{.offset,limit}.html?${querystring}"
                + columns
                  + select
                    - select = true
                  + col1
                    - jcr:title = "Column 1"
                  + col2
                    - jcr:title = "Column 2"
                + datasource
                  - sling:resourceType = "granite/ui/components/coral/foundation/querybuilder/datasource"
                  - itemResourceType = "my/row"
                  - limit = '${empty requestPathInfo.selectors[2] ? "41" : requestPathInfo.selectors[2] + 1}'
                  - offset = "${requestPathInfo.selectors[1]}"
            + actions
              + selection
                + open
                  - granite:rel = "cq-siteadmin-admin-actions-edit-activator"
                  - sling:resourceType = "granite/ui/components/coral/foundation/collection/action"
                  - action = "cq.wcm.open"
                  - activeSelectionCount = "multiple"
                  - icon = "edit"
                  - target = "#cq-sites-search-result"
                  - text = "Open"
                  - variant = "actionBar"
                  + data
                    - cookiePath.url = "/"
                    - href.uritemplate = "/bin/wcmcommand?cmd=open&_charset_=utf-8&path={item}"