ericgio / react-bootstrap-typeahead

React typeahead with Bootstrap styling
http://ericgio.github.io/react-bootstrap-typeahead/
MIT License
1.01k stars 408 forks source link

AsyncTypeahead and searchText programatically #736

Closed GABuryan closed 2 years ago

GABuryan commented 2 years ago

I use old version - 4.0.0-alpha.9.

I want to make the behavior similar Typeahead. on calling the menu with the mouse, I launch search.

<AsyncTypeahead
  ...
  onSearch={this.handleSearch}
  onMenuToggle={this.handleMenuToggle}
/>

handleMenuToggle(isMenuShow) {
  if (isMenuShow) {
    this.handleSearch(this.state.query);
  }
}

The search starts, but the text remains as for "promptText". How to change the text that is used for "searchText"? This can be done programmatically? Thank you.

GABuryan commented 2 years ago

Judging by the code, I realized that I had to change isLoading. But then I have another problem - when isLoading={true}, an icon appears. How is it possible not to show it, so that only the text is written (there is an option to hide rbt-loader via css)?

But even if you use isLoading, it only works with onSearch. If you try to run a search through onMenuToggle, the text does not change.

ericgio commented 2 years ago

@GABuryan: sorry, but I don't understand what you're asking for here. Can you please clarify your feature request? Thanks!

GABuryan commented 2 years ago

I'm just asking for implementation advice. Now in AsyncTypeahead, the search is launched using the onSearch method. But this is activated by typing on the keyboard. Accordingly, the text from the searchText "Searching..." will be output. I want to activate the search by clicking on Asynctypeahead. I'm running a method search in onMenuToggle. But with this approach, onSearch does not work and, accordingly, the text from searchText - "Searching..." is not output. Is it possible to programmatically simulate the triggering of onSearch?

ericgio commented 2 years ago

The async functionality is primarily meant to work with user input, since it debounces the input. It seems like you should be able to trigger your search function using onMenuToggle as you're doing. You can pass a different string to the emptyLabel prop to indicate that the request is in progress.

You may want to consider looking at the async behavior and writing your own version, since it sounds like you have some specific use cases you're trying to address.

GABuryan commented 2 years ago

Thanks for variant with change Text props.