Home > widget-integration > FilterHandler > handleSort

FilterHandler.handleSort() method

Handles sort dropdown interaction and state changes.

Manages the sort dropdown UI state and processes sort option selection. Handles opening/closing the dropdown, selecting sort options, and triggering filter resets when sort changes. Override this method to customize sort behavior or add validation logic for specific sort options.

Signature:

handleSort(target: HTMLElement, originalEvent?: Event): void;

Parameters

Parameter

Type

Description

target

HTMLElement

The clicked element (sort button, value, or option)

originalEvent

Event

(Optional) Optional original event for stopping propagation when selecting options

Returns:

void

Remarks

Handles three interaction types: - Click on option: Selects sort value and triggers filter reset - Click on button/value: Toggles dropdown open/closed state - Other clicks: Ignored

Emits SORT_CHANGED event to update UI after state changes.

Example

Extend to add sort option validation:

window.boostWidgetIntegration.extend('FilterHandler', (FilterHandler) => {
  return class CustomFilterHandler extends FilterHandler {
    handleSort(target, originalEvent) {
      const isOption = target.classList.contains('boost-sd__sorting-option');

      if (isOption) {
        const sort = target.getAttribute('data-value');
        // Restrict certain sort options for specific collections
        if (sort === 'price-ascending' && this.isGiftCardCollection()) {
          alert('Price sorting not available for gift cards');
          return;
        }
      }

      return super.handleSort(target, originalEvent);
    }
  };
});