---
schema_version: "1"
id: 91d816f43fe4879875a28ca11c718e50927132321b85ce8b8e0eec905045c9d1
title: Search Suggestion
collection: developer
version: current
locale: en-us
portal_url: https://docs.salesforce.com/developer/current/en-us/commerce-cloud/b2c-commerce/guides/search-and-navigation/b2c-search-suggestion-for-developers.md
canonical_url: https://developer.salesforce.com/docs/commerce/pwa-kit-managed-runtime/guide/b2c-search-suggestion-for-developers.html
source_site: developer.salesforce.com
content_type: documentation
content_hash: f68923b3dfb0f13064c5779f4cc4a0fd4663b771e86ad356740330324562d340
products:
  - Composable Storefront
  - Salesforce APIs
---
# Search Suggestion

Add more complex search completion support to your application via the Salesforce B2C Commerce APIs. Before you begin coding, review the SiteGenesis application to see how this feature was implemented.

## SiteGenesis Implementation

Review these SiteGensis files to understand how this feature was implemented, for example:

- SiteGenesis/cartridge
  - `static/default/js/app.js`
  - `templates/default/resources/appresources.isml`
- SiteGenesis Storefront Core/cartridge
  - `pipelines/Search.xml`
  - `static/default/css/style.css`
  - `templates/default/search/suggestionsbeta.isml`
  - `templates/resources/search.properties`
- Data files: `sg20_demo_data_no_hires_images/meta/system-objecttype-extensions.xml`

When you implement this feature, you need to consider the performance impact. The SiteGenesis implementation shows suggestions as a popup immediately after the customer starts entering text in the search field. The popup's HTML content is fetched using an asynchronous AJAX call. The SiteGenesis application executes the AJAX calls in a gracefully way as follows:

- Only one request at a time
- Only if search phrase has changed
- If the search phrase has changed multiple times while a single AJAX call was running, only the last most recent search phrase is used in the next AJAX call (no queuing)
- The page cache must be used on the server
- The minimum input length is set to three (3) characters

## Using the B2C Commerce APIs

Use the B2C Commerce APIs to customize your code. The _Suggest_ API consists of the following:

- `dw.suggest.SuggestModel` class: main access point to obtain suggestions
- `dw.suggest.Suggestions` class: container for bundling suggested items (for example, products), suggested phrases, and the specific terms of a particular type (for example, auto completed products names), for example, _dw.suggest.ProductSuggestions_
- `dw.suggest.SuggestedTerms` class: lists of terms suggested for a single term of the customer input
- `dw.suggest.SuggestedTerm` class: provided by specific classes such as _SuggestedProduct_ or _SuggestedContent._ Each _SuggestedTerm_ object represents a single suggested term and its associated attributes and flags
- `dw.suggest.SuggestedPhrases` class: represents one or more search phrases suggested by B2C Commerce
- `dw.catalog.ProductSearchModel.getSuggestedSearchPhrase` method: provides the corrected search phrase as a hint on the search results page.

See the B2C Commerce APIs for more information.

**Match Types**

Matches are defined as follows:

| Match Type      | Ranking Priority | Description                                                                              |
| --------------- | ---------------- | ---------------------------------------------------------------------------------------- |
| Exact           | 1                | The original and suggested terms are exactly equal                                       |
| Auto completion | 2                | The original is a prefix of the suggested term.                                          |
| Fuzzy           | 3                | The original and suggested terms differ by a few characters, similar to spell correction |

**note:** The match types and ranking described here is only applicable for suggested terms, that is, auto completion and auto correction. It doesn't affect any search results or sorting rules.