Coveo Field Sort

Legacy feature

This article pertains to the Coveo Hive framework which is now in maintenance mode.

Choose one of Coveo’s more modern, lightweight, and responsive libraries for any future search interface development. See the search interface Implementation guide for more details.

By default, the Coveo Field Sort rendering implements the Coveo JavaScript Search Framework Sort component with the sortCriteria component option set to @<SORT_FIELD> <SORT_DIRECTION>. Clicking the Coveo Field Sort search interface button allows the user to switch to result sorting based on the specified Sort field. Subsequent clicks allow the user to toggle between ascending and descending sort directions (if the Enable sort direction toggle option is enabled).

When the wrapping Results Sorts Section rendering Enable sort dropdown data source option is enabled, the Coveo Field Sort rendering adds one or two field sort items (depending on the Enable both sort directions value) to a sort dropdown list (see the Coveo JavaScript Search Framework SortDropdown component)).

Usage notes

Insertion location

Coveo Hive

The Coveo Field Sort rendering is an Allowed Control in the following placeholder(s): Sorts

Example insertion sequence for the Coveo Field Sort rendering.

Coveo Hive SXA

Coveo for Sitecore SXA rendering insertion locations aren’t limited by placeholder Allowed Controls. The Coveo Field Sort rendering may therefore be inserted throughout the partial design, whether in Coveo for Sitecore or Sitecore placeholders.

Example insertion sequence for the Coveo Field Sort rendering.

Data source options

Option name Description


See the caption component option.

Sort field

See the sortCriteria component option.

Sort direction

Specifies the default sorting direction (see the sortCriteria component option).

Enable sort direction toggle

Enable both sort directions

Specifies whether to allow sorting in both sorting directions.

DOM unique ID

Randomly generated HTML element ID.

Additional data attributes

Allows use of the Coveo JavaScript Search Framework Sort component options that aren’t directly available in the data source.

Sample generated HTML and corresponding visual output

<div class="coveo-sort-container">
   <span id="coveo0a107bfe"
   class="CoveoSort coveo-accessible-button coveo-selected coveo-accessible-button-pressed coveo-ascending"
   data-caption="Price" data-prebind-sort-criteria="sortCriteriaResolver"
   data-sort-criteria="@currentprice descending, @currentprice ascending"
   data-sc-enable-both-sort-directions="true" data-applied-prebind="true" role="button"
   aria-label="Sort results by Price" tabindex="0">
      <span class="coveo-icon">
         <span class="coveo-sort-icon-ascending">
            <!-- SVG arrow up graphic code here -->
         <span class="coveo-sort-icon-descending">
            <!-- SVG arrow down graphic code here -->
Field Sort example | Coveo for Sitecore 5