Menu
I'm very new to Ionic framework.
Following the docs I created a searchbar like this:
<ion-searchbar
[(ngModel)]="searchQuery"
[showCancelButton]="true"
(ionInput)="search($event)">
</ion-searchbar>
ionInput When the Searchbar input has changed including cleared.
This works as expected.
However I want a different behaviour. I don't want to trigger search($event) every time the input changes, but I couldn't find an output event that is emitted when the user hits the 'enter' key or clicks a button for example.
Is there a solution for this behaviour?
434
var input = document. getElementById("myInput"); // Execute a function when the user releases a key on the keyboard input. addEventListener("keyup", function(event) { // Number 13 is the "Enter" key on the keyboard if (event. keyCode === 13) { // Cancel the default action, if needed event.
To submit the form using 'Enter' button, we will use jQuery keypress() method and to check the 'Enter' button is pressed or not, we will use 'Enter' button key code value. Explanation: We use the jQuery event. which to check the keycode on the keypress.
You should be able to add Angular 2 keyup bindings to elements such as keyup and click
Template:
<ion-searchbar #q
[showCancelButton]="true"
(keyup.enter)="search(q.value)">
</ion-searchbar>
Component TS:
search(q: string) {
console.log(q);
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
