Quantcast
Channel: Ionic Forum - Latest posts
Viewing all articles
Browse latest Browse all 229110

Ion-search: keep cancel button visible

$
0
0

I’ve noticed that the CANCEL button in the ion-searchbar disappears on blur in my header menu. Is there a way to keep that visible at all times (or until I want it to go away)?

I’m changing the page content to show search results. If the user scrolls though the results, the button disappears, which could be confusing since the user will want to dismiss search results at some point to return the page to it’s normal state. As it is now, they first need to return focus to the search field (which restores the cancel button’s visibilty) and then hit the cancel button.

<ion-header>
  <ion-navbar>
    <ion-buttons end>
        <button ion-button icon-only (tap)="showOptions($event,'discover')"  *ngIf="!hideOptionsButton">
            <ion-icon name="options"></ion-icon>
        </button>
    </ion-buttons>
    <form (ngSubmit)="submitSearch($event)">
      <ion-searchbar
      placeholder="Global Search"
      [(ngModel)]="searchQuery"
      [ngModelOptions]="{standalone: true}"
      [showCancelButton]="activeSearch"
      (ionCancel)="clearSearch($event)"
      (ionInput)="menuFocusMode($event)">
      </ion-searchbar>
    </form>
  </ion-navbar>
</ion-header>

Viewing all articles
Browse latest Browse all 229110

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>