question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Cancel button of ion-searchbar not working probably? V4

See original GitHub issue

Bug Report

Ionic Info

Ionic:
   ionic (Ionic CLI)          : 4.0.6
   Ionic Framework            : @ionic/angular 4.0.0-beta.2
   @angular-devkit/core       : 0.7.3
   @angular-devkit/schematics : 0.7.3
   @angular/cli               : 6.1.3
   @ionic/ng-toolkit          : 1.0.6
   @ionic/schematics-angular  : 1.0.4

Describe the Bug When using ion-searchbar and click the cancel button (back arrow) should navigate me to another page. This functionally is working on the mobile browser but on the desktop browser is does not work? (nothing happened when clicking on cancel button)

Steps to reproduce the behaviour:

  1. Click on the search box
  2. Click the cancel button (back arrow)

Related Code .html <ion-searchbar showCancelButton=true (ionCancel)="onCancel($event)"></ion-searchbar> .ts onCancel(event) { this.router.navigateByUrl('/home'); }

Expected Behavior The cancel button should trigger function which goes back to homepage using Router.

Issue Analytics

  • State:closed
  • Created 5 years ago
  • Reactions:2
  • Comments:9 (5 by maintainers)

github_iconTop GitHub Comments

1reaction
paulstelzercommented, Jan 3, 2019

Of course you can write <ion-searchbar showCancelButton (ionCancel)="onCancel($event)"></ion-searchbar> too. But it’s working 😃 The prefix ion is used because so it not collide with others

0reactions
ionitron-bot[bot]commented, Feb 2, 2019

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Cancel button of ion-searchbar not working probably? V4
Click on the search box · Click the cancel button (back arrow).
Read more >
IONIC 4: cancelButtonText of ion-searchbar is not working
Using IONIC 4 ion-searchbar, I am trying to add cancelButtonText as below which it is not working. //first way <ion-searchbar showCancelButton=" ...
Read more >
Close search bar in Angular or Ionic 5 when hitting cancel button
I would like to make sure the searchbar is closed after hitting cancel, like on native iOS . Is there a way to...
Read more >
Search Results Under Searchbar : r/ionic - Reddit
I am using Ionic and Angular to create a grocery list app. The design I was given calls for a searchbar with results...
Read more >
Building an Ionic 4 Pokédex with Search, Infinite Scroll ...
Don't worry right now - there is a built in debounce time in the Ionic search bar so the function won't be called...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found