Overview

This component displays a message when the SDK performs a search action that returns no results. This message is removed after a new search is performed that does return results.

This component must be linked with a search Store, since it listens to its events to check if the SDK has performed a search with no results.

Usage

This is how you create this component:

sdk.component('no-results', target: HTMLElement|String);

After the component is triggered, it shows the following message:

Here is the HTML of the message depicted above:

  <div class="inbenta-search-no-results">
    <div class="inbenta-search-no-results__header inbenta-search-title">
      {{ NO_RESULTS_NOT_FOUND_HEADER }}
    </div>
    <div class="inbenta-search-no-results__title inbenta-search-title">
      {{ NO_RESULTS_NOT_FOUND_TITLE }}
    </div>
    <div class="inbenta-search-no-results__subtitle">
      {{ NO_RESULTS_NOT_FOUND_SUBTITLE }}
    </div>
  </div>

Labels

This component uses the following labels:

Tracking

This component does not track any event.

Example using results component Store through method linkTo

<div id="no-results"></div>
<div id="results"></div>

<script>
  var noResults = sdk.component('no-results', '#no-results');
  var results = sdk.component('results', '#results');
  results.linkTo(noResults);
</script>

In this example, the no-results component listens to the Store events of the results component.