How can I add a drop down select option to an alert?

Hello! I am creating a small ionic list application. When users want to add or edit an item on the list, an alert prompt pops up and they have the option to type a name in the text field. My other field, quantity, is currently a text field, however, I would like to make this a drop down select option instead. Is there a way to do this? I’m new to ionic, so any help would be greatly appreciated! A snippet of my code is below.

  > async showPrompt(item?, index?) {
>     const alert = await this.alertController.create({
>       header: item ? 'Edit Item' : 'Add Item',
>       message: item ? "Please edit item...": "Please enter item",
>       inputs: [
>         {
>           name: 'name',
>           placeholder: 'Name',
>           value: item ? item.name : null
>         },
>         {
>           name: 'quantity',
>           placeholder: 'Quantity',
>           value: item ? item.quantity : null
>         },
>       ],
>       buttons: [
>         {
>           text: 'Cancel',
>           handler: data => {
>             console.log('Cancel clicked');
>           }
>         },
>         {
>           text: 'Save',
>           handler: item => {
>             console.log('Saved clicked', item);
>             if (index !== undefined) {
>               this.dataService.editItem(item, index);
>             }
>             else {
>               this.dataService.addItem(item);
>             }
>           }
>         }
>       ]
>     });
>     await alert.present();
>   }

Look at the ion-modal component to solve this instead of the ion-alert :slight_smile:

1 Like

Is there a way to do it using the ion-select component?

Yes. Read the docs on the component. It is more flexible that the alert.