Help with SearchforFacetValues

Hi all,

I’m still in the trial phase of Algolia. I started dabbling with InstantSearch and love it. That said, I’m running into an issue that I haven’t been able to resolve by researching the online documentation and tutorials.

My issue is that the ‘brand’ Search box that’s provided in the Algolia demo, isn’t clickable when I use my test index on my personal site. At first, I thought my issue was with the searchForFacetsValues code below. This code is ‘as is’ from the Algolia demo [1]. I later found the Algolia blog post which introduced the new feature [2]. The blog post provides the following guidance.

"Our new functionality only requires two elements:

  • Configure the facet to be searchable: searchable(attribute) instead of attribute in the attributesForFacetting
    
  • Use the new method of the API to actually search in the values"

Now I think that I may have my API misconfigured in the dashboard. When I remove ‘brands’ from _attributesForFacetting_in the dashboard, the search widget vanishes from the webpage. Has anyone else seen this behavior?

[1] https://preview.algolia.com/instantsearch/
[2] https://blog.algolia.com/search-for-facet-values/

search.addWidget(
instantsearch.widgets.refinementList({
  container: '#brand',
  attributeName: 'brand',
  sortBy: ['isRefined', 'count:desc', 'name:asc'],
  limit: 10,
  operator: 'or',
  searchForFacetValues: {
    placeholder: 'Search for brands',
    templates: {
      noResults: '<div class="sffv_no-results">No matching brands.</div>',
    },
  },
  templates: {
    header: getHeader('Brand'),
  },
})

);

1 Like

Actually Algolia Support helped me figure it out. I was in test mode, and didn’t have much data loaded into my test index.

My code was stock, in that it the minimum was ‘10 brands’. I only had 5 at the time of testing. So long as your index has more values than specified by Limit, then the search box will be clickable. #newbie

instantsearch.widgets.refinementList({
  container: '#brand',
  attributeName: 'brand',
  sortBy: ['isRefined', 'count:desc', 'name:asc'],
  limit: 10,