Re-render docsearch hits with an additional filter

Hello,

Is it possible to pass in a filter to an existing docsearch instance and have it re-render?

For example let’s say a user types into the docsearch input field and a list of hits are displayed. Then the user clicks on a button and a filter is passed to the docsearch instance. Then I’d like the list of hits to be re-rendered with the updated filter, but I’m not sure if it’s possible with docsearch.

Below is a rough version of what I’d like to do:

// Init docsearch
const doc_search = docsearch({
      ... my docsearch config ...
 )};

// When a user clicks a button...
$(".filter-button").on(click, event => {
  // Update doc_search filter
  doc_search.algoliaOptions.filters = "component: server";
  
  // Is there a function I can call here to update/re-render the search?
})

I’ve been looking at this docsearch document and this autocomplete document to try to find a solution so far.

Thanks for the help!

Update: I was able to get the hits to re-render by using docsearch’s autocomplete property.

By passing in a new value to autocomplete I was able to re-render the hits.

// Init docsearch
const doc_search = docsearch({
      ... my docsearch config ...
 )};

// When a user clicks a button...
$(".filter-button").on(click, event => {
  // Update doc_search filter
  doc_search.algoliaOptions.filters = "component: server";
  
  // Pass in new search value
  doc_search.autocomplete.autocomplete.setVal("new search val");
})

But right now I’m stuck trying to re-render the hits without passing a new search value. Is there anyway for me to re-render without passing a new search value?

:wave: @ben.lehman

Thank you for reaching out.

What you are trying to achieve is not doable with the current version of the default DocSearch UI. We are working on a new alpha version of Autocomplete and the DocSearch UI, stay tuned.

As a side note, once you have edited the filters, you must trigger a new search since the search engine will not have the same configuration at the query time.

What I will recommend you in the meantime is to give a try to implement your own UI with InstantSearch which will give you more control over the source and filtering.

Let us know if you need anything else,

Cheers

1 Like

Thanks for the reply @Sylvain.PACE.

A new version of autocomplete and docsearch is good news! I would’ve used Instant search for this problem but my client really liked the grouping that docsearch does for the hits.

A pretty hacky way I got it work was to pass an empty value into the search and then re-pass in the initial search value, in case anyone comes across this issue as well.

Thanks for the help!

1 Like