How to show button when option is selected

Ionic Framework
1

I’m still new in using Ionic. I want to show a submit button only when one or more option is selected. My code goes like this

  <ion-card>
     <ion-item>
     <ion-icon name="trash" slot="start"></ion-icon>
     <ion-select id="dispose" multiple="true" placeholder="What to dispose?" >
        <ion-select-option value="Biodegradable">Biodegradable</ion-select-option>
        <ion-select-option value="Non-biodegradable">Non-biodegradable</ion-select-option>
        </ion-select>
     <ion-icon name="notifications" slot="end"></ion-icon>
     </ion-item>
  </ion-card>

<ion-button  color="success">Submit</ion-button>
2

hi, @noctis03

Here I’ve used ngmodel for storing the options which you’ve selected and by using variable dispose you can show your submit button.

<ion-card>
     <ion-item>
     <ion-icon name="trash" slot="start"></ion-icon>
     <ion-select id="dispose" multiple="true" [(ngModel)]="dispose" placeholder="What to dispose?" >
        <ion-select-option value="Biodegradable">Biodegradable</ion-select-option>
        <ion-select-option value="Non-biodegradable">Non-biodegradable</ion-select-option>
        </ion-select>
     <ion-icon name="notifications" slot="end"></ion-icon>
     </ion-item>
  </ion-card>

<ion-button  *ngIf="dispose.length>0" color="success">Submit</ion-button>

TS file:

dispose:any=[];

Hope it helps!!

3

It works! Thank you for the help.

4

Please mark it as solution so, that others can get help from this.
Thank you!! :slightly_smiling_face: