0

I am using ionic 5 to build an app and I would like to have a search bar to search and show results from a server.

When looking on the documentation (https://ionicframework.com/docs/api/searchbar), it seems that this element is designed with local filtering in mind.

The event ionInput behaves very similarly to the ionChange, and fires when the input is changed.

I would like to search on the server and present the results only when the user confirms the search (i.e. by pressing enter).

I could not find how to do that.

Best Regards, Guilherme.

Guilherme Dellagustin
  • 69
  • 6

1 Answers1

0

I found out a solution for this, wrapping the search bar element in a form element and reacting to the onSubmit event of the form:

export default class MyComponent extends React.Component<{}> {
    handleSubmit(e: FormEvent) {
        e.preventDefault();
        console.log("submitted")
    }

    render() {
          return (
          <form onSubmit={e => this.handleSubmit(e)}>
               <IonSearchbar/>
          </form>
        );
    }
}
Guilherme Dellagustin
  • 69
  • 6