Commerce Reference Store uses the auto-suggest functionality that is incorporated into the SearchBox cartridge out of the box. When auto-suggest is enabled, the search box displays an auto-suggest panel with suggestions that match what the shopper is entering in the search term field. The auto-suggestions themselves are the display names of dimension values, from specified dimensions, that match the characters entered by the shopper. For example, Commerce Reference Store configures the product.features.displayName dimension as a source dimension for auto-suggestions. When a shopper enters “woo” in the search box, two auto-suggestions are rendered, “solid wood” and “wool,” both of which are dimension values in the product.features.displayName dimension.
The auto-suggest feature is rendered via three cartridges:
The
SearchBoxcartridge, where auto-suggest feature is enabled.The
AutoSuggestPanelcartridge, which defines the panel that contains the suggestions.The
DimensionSearchAutoSuggestItemcartridge, which supplies theAutoSuggestPanelwith suggestions.
Auto-suggest behavior is configured partly through the SearchBox cartridge and partly through the DimensionSearchAutoSuggestItem cartridge. The SearchBox cartridge enables the autosuggest panel’s display and has a setting for specifying the minimum number of characters that must be typed before the autosuggest panel appears. Commerce Reference Store sets this value to 3. The DimensionSearchAutoSuggestItem cartridge specifies the dimensions whose values are used to populate the panel. Commerce Reference Store configures the cartridge to use the product.brand and product.features.displayName dimension values.
Note: For more details on the customer-facing aspects of the search box implementation, see the Search and Guided Navigation chapter. Additional details on the AutoSuggestPanel and DimensionSearchAutoSuggestItem cartridges are also available at AutoSuggestPanel and DimensionSearchAutoSuggestItem, respectively.
