Need to trigger ion-select by clicking a button in ionic 4

guys when i click a ion-button i need to open a ion-select-option in ionic 4. please suggest me the solution

Hello, Share a sample code or what did you try? share sample code to understand your issue so that way people can give you answer.

// in html :
<ion-button (click)="openSelect()>open</ion-button>
<ion-select multiple="true" #select1>
<ion-select-option> today </ion-select-option>
<ion-select-option>tommorow</ion-select-option>
<ion-select-option>weekend</ion-select-option>
</ion-select>

// in ts :
import { IonSelect } from ‘@ionic/angular’;

@ViewChildren(‘select1’) select1: IonSelect ;

openSelect(){
this.select1.open()
}

// and the error is:

this.select1.open is not a function

Hello, Just change @ViewChildren to ViewChild

here working example:

home.ts

import { IonSelect } from '@ionic/angular';

@ViewChild('mySelect', { static: false }) selectRef: IonSelect;

openSelect() {
  this.selectRef.open()
}

home.html

<ion-button (click)="openSelect()">open</ion-button>
<ion-select multiple=" true" #mySelect>
  <ion-select-option> today </ion-select-option>
  <ion-select-option>tommorow</ion-select-option>
  <ion-select-option>weekend</ion-select-option>
</ion-select>

Hope it helps you :slight_smile:

2 Likes

thanks bro its working…

// for multiple select i just use this below method and its working if you know some simple method for multiple please suggest me… thanks for helping :slight_smile:

@ViewChild('mySelect', { static: false }) selectRef: IonSelect;
@ViewChild('mySelect1', { static: false }) selectRef1: IonSelect;