Can we create multiple searchbox with search and clear button for each of them. is this something can be implemented with react out of box library?

Elastic Search
1

we have currently one searchbox with search and clear button on it. But now we want to add another text box with similar functionality but with exact search on this one. is this something can be implemented ?

if i use "disease" with quotes, sometime it works as exact search but what is the preferred way of implementing

2

Do you want to do this in App Search?

3

Yes we are using App Search. we are using React search UI

4

Can anybody help me on this ?.
I was thinking if we have multiple seachbox , how can we 2 search term to call elastic api o n search ?

5

Hey @pradeepjanga,

I recommend using a single search box and adding an "Exact match" checkbox to toggle whether or not an exact match query is going to be performed.

When the option is enabled, you can automatically wrap the users input in quotes.

6

with quotes, i will get the subset of the match right ?
i want to search only exact math.
ex: if i search with A124. we get want only one record even if there are 2 records like A124, A124a.
Also on that checkbox click, how to tell to search only on specific facet ?

7

Also how to intercept the request on onSearch to add the quotes ?

8

Also if we really want to use the 2 search box independent, can we achieve using the react search UI library ?

9

with quotes, i will get the subset of the match right ?
i want to search only exact math.
ex: if i search with A124. we get want only one record even if there are 2 records like A124, A124a.

I don't know. Can you just use the first result in this case?

Instead of using a search query, you could make it a filter on that field instead, that will give you only the exact value.

Also how to intercept the request on onSearch to add the quotes ?

You could use the onSearch handler on the connector for that: https://github.com/elastic/search-ui/blob/master/ADVANCED.md#connectors-and-handlers

Also if we really want to use the 2 search box independent, can we achieve using the react search UI library?

I think you should be able to using one of the solutions we've chatted about here.

1 Like
10

Thanks for your response.
Is there a way to add custom property to the request state and use that on the onSearch connector?

onSearch: async (requestState, queryConfig, next) => {

11

Hey @pradeepjanga

Another option would be to create an input box component which uses the setFilter method. See link below where I have a working example. In this example im using the "states" field and setting the value in the input box to the filter when the customer clicks search. An example of this working is searching for "Alaska". It will not match on partial text (also one thing to note that its case sensitive too). Hope this helps!

Joe

2 Likes
12

Thanks for that. is the setFilter action only look for exact match ?

13

hey Pradeepjanga - yes exact match. Sorry for not replying earlier, I missed your reply!

14

Thank you Joe. you working example helped me alot. Thanks again

15

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