# SearchUI get all results from autocomplete

**URL:** <https://discuss.elastic.co/t/searchui-get-all-results-from-autocomplete/336564>\
**Category:** Elastic Search\
**Tags:** elastic-app-search\
**Created:** [June 21, 2023, 10:42am UTC](https://discuss.elastic.co/t/searchui-get-all-results-from-autocomplete/336564 "2023-06-21T10:42:58Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![adrian\_es](https://avatars.discourse-cdn.com/v4/letter/a/ba9def/32.png) [@adrian\_es](https://discuss.elastic.co/u/adrian_es)\
**Post date:** [June 21, 2023, 10:42am UTC](https://discuss.elastic.co/t/searchui-get-all-results-from-autocomplete/336564/1 "2023-06-21T10:42:58Z")

</div>

Hello!

I'm trying to replace my current search bar, located in the header of my React app, using SearchBox from SearchUI.  
When a user clicks a match I use onSelectAutocomplete to apply some custom logic to decide what page I redirect them to, which works fine.  
But if the user types a partial match and hits enter, I would like to collect all the results and redirect him to a search page, where I display all the results with facets.  
I can't figure out how I can get the results so I can forward the user to the search page.

```auto
<SearchProvider config={config}>
    <SearchBox
          onSubmit={searchTerm => handleSearch(searchTerm)}
          onSelectAutocomplete={searchTerm => handleSearch(searchTerm)}
          autocompleteMinimumCharacters={3}
             autocompleteResults={{
             sectionTitle: 'Results',
             titleField: 'name',
             shouldTrackClickThrough: true,
          }}
          autocompleteSuggestions={{
              sectionTitle: 'Suggested Queries',
          }}
    />

```

Also, is there a way to add two fields with custom formatting to titleField? eg. 'name - description'  
Any help will be very much appreciated.

Thanks!

---

<div class="post-metadata">

**Author:** ![joemcelroy](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/joemcelroy/32/103757_2.png) [@joemcelroy](https://discuss.elastic.co/u/joemcelroy)\
**Post date:** [June 21, 2023, 10:50am UTC](https://discuss.elastic.co/t/searchui-get-all-results-from-autocomplete/336564/2 "2023-06-21T10:50:04Z")

</div>

Hey @adrian_es,

You should be able to override the `onSubmit` function to redirect the customer to the search page, providing the query in the url. [Autocomplete | Elastic docs](https://docs.elastic.co/search-ui/solutions/ecommerce/autocomplete#integrating-the-searchbox)

```ts
<SearchBox
            onSubmit={(searchTerm) => {
              window.location.href = `${PATH_TO_YOUR_SEARCH_PAGE}?q=${searchTerm}`;
            }}
/>

```

---

<div class="post-metadata">

**Author:** ![adrian\_es](https://avatars.discourse-cdn.com/v4/letter/a/ba9def/32.png) [@adrian\_es](https://discuss.elastic.co/u/adrian_es)\
**Post date:** [June 21, 2023, 11:09am UTC](https://discuss.elastic.co/t/searchui-get-all-results-from-autocomplete/336564/3 "2023-06-21T11:09:41Z")

</div>

Hi, @ [joemcelroy](https://discuss.elastic.co/u/joemcelroy)!

Thank you for the fast reply.  
So if I redirect them to the search page, I need to do another search, not use the existing results?

And one more unrelated question: after the redirect, the search term is not cleared from SearchBox. Can you please tell me how I can clear the search term?  
Thanks!

---

<div class="post-metadata">

**Author:** ![joemcelroy](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/joemcelroy/32/103757_2.png) [@joemcelroy](https://discuss.elastic.co/u/joemcelroy)\
**Post date:** [June 21, 2023, 3:00pm UTC](https://discuss.elastic.co/t/searchui-get-all-results-from-autocomplete/336564/4 "2023-06-21T15:00:08Z")

</div>

So the example I shared above is where the search box is present globally on the site and the `onSubmit` handler will navigate the user to the global search page. On the search page, the search experience has the search term populated, to reflect the search state.

Is there a reason why you dont want the searchbox to reflect what is the search state?

Joe

---

<div class="post-metadata">

**Author:** ![adrian\_es](https://avatars.discourse-cdn.com/v4/letter/a/ba9def/32.png) [@adrian\_es](https://discuss.elastic.co/u/adrian_es)\
**Post date:** [June 21, 2023, 3:14pm UTC](https://discuss.elastic.co/t/searchui-get-all-results-from-autocomplete/336564/5 "2023-06-21T15:14:59Z")

</div>

It makes sense to leave the search term in the search box while on the global search page, but if I navigate away from the search page, the search term still remains in the SearchBox.  
In this case, I would like to clear the search term.

Thanks for all the rapid replies!

I have two final questions if you are still able to help, although it's not related to the topic:

1. is there a way to add two fields with custom formatting to SearchBox titleField? eg. 'name - description'
2. The facets currently show fields that have empty strings, is there a way to exclude them?

And thanks again!

---

<div class="post-metadata">

**Author:** ![joemcelroy](https://sea2.discourse-cdn.com/elastic/user_avatar/discuss.elastic.co/joemcelroy/32/103757_2.png) [@joemcelroy](https://discuss.elastic.co/u/joemcelroy)\
**Post date:** [June 28, 2023, 1:46pm UTC](https://discuss.elastic.co/t/searchui-get-all-results-from-autocomplete/336564/6 "2023-06-28T13:46:52Z")

</div>

Hey sorry missed this reply!

1- Could you explain more on how you want it to be custom formatted, potentially a screenshot of what you want?  
2 - is there a way you can stop indexing empty values into the field? Its not ideal to exclude them at presentation.

joe

---

<div class="post-metadata">

**Author:** ![adrian\_es](https://avatars.discourse-cdn.com/v4/letter/a/ba9def/32.png) [@adrian\_es](https://discuss.elastic.co/u/adrian_es)\
**Post date:** [June 28, 2023, 2:48pm UTC](https://discuss.elastic.co/t/searchui-get-all-results-from-autocomplete/336564/7 "2023-06-28T14:48:39Z")

</div>

Hey @joemcelroy ,

1. the SearchBox autocompleteResults titleField seems to accept only one field.  
But I would like to display two fields. "field1 - field2".  
If I have:

```auto
{
  field1: "foo",
  field2: "bar", 
}

```

When I search for 'foo', I would like to display in the search results: "foo - bar".  
As a workaround, I added an extra field that has both values in the format above. Was just wondering if there's a better way to do this.

1. fixed that by replacing empty values with null.

2. The thing I couldn't figure out, how to clear the search term from the SearchBox.  
If I navigate away from the search page, the search term isn't cleared from my SearchBox.

Thanks!

---

<div class="post-metadata">

**Author:** ![indian223666](https://avatars.discourse-cdn.com/v4/letter/i/5e9695/32.png) [@indian223666](https://discuss.elastic.co/u/indian223666)\
**Post date:** [June 28, 2023, 3:53pm UTC](https://discuss.elastic.co/t/searchui-get-all-results-from-autocomplete/336564/8 "2023-06-28T15:53:03Z")

</div>

It makes sense to leave the search term in the search box while on the global search page, but if I navigate away from the search page, the search term still remains in the SearchBox.  
In this case, I would like to clear the search term.

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/elastic/original/3X/1/a/1ac57faf039f6b580b3f104ef42a2a89e41014de.png) [@system](https://discuss.elastic.co/u/system)\
**Post date:** [July 26, 2023, 3:53pm UTC](https://discuss.elastic.co/t/searchui-get-all-results-from-autocomplete/336564/9 "2023-07-26T15:53:54Z")

</div>

This topic was automatically closed 28 days after the last reply. New replies are no longer allowed.
