CODEWITHSUNDEEP
ionic-frameworkionic3
ro ko
ro ko

Reputation: 2986

Ionic 3: Ion-select unselect selected option

I have a simple ion-select in my template. It is not a mandatory field hence not selecting any option is allowed. 

<ion-item>
  <ion-label>Gender</ion-label>
  <ion-select [(ngModel)]="gender" placeholder ="- Any -">
    <ion-option value="f">Female</ion-option>
    <ion-option value="m">Male</ion-option>
  </ion-select>
</ion-item>

I have placed a placeholder="any" and works just fine until user doesn't select anything. However, once user chooses one of the option and decides not to choose any again, user cannot go back to choosing none. I looked at the docs but couldn't get any clue. Any idea on how can user unselect the option once one of the option has been touched/chosen before?

Upvotes: 6

Views: 3601

Answers (1)

Skrettinga
Skrettinga

Reputation: 139

Easiest way is to add a third option of any or whatever you would like it to be

<ion-item>
  <ion-label>Gender</ion-label>
  <ion-select [(ngModel)]="gender" placeholder ="- Any -">
    <ion-option value="f">Female</ion-option>
    <ion-option value="m">Male</ion-option>
    <ion-option value="">- Any -</ion-options>
  </ion-select>
</ion-item>

Upvotes: 1

Related Questions