Why Call Alert is not working properly

Ionic Framework ionic-v3
1 
catselected(catSelected){
		this.doRadio();
}

doRadio() {
    let alert = Alert.create();
    alert.setTitle('Lightsaber color');

    alert.addInput({
      type: 'radio',
      label: 'Blue',
      value: 'blue',
      checked: true
    });

    alert.addButton('Cancel');
    alert.addButton({
      text: 'OK',
      handler: data => {
        this.testRadioOpen = false;
        this.testRadioResult = data;
      }
    });
	this.nav.present(alert);
}

I have above code in .ts file and in html I have below code

<ion-list>
    <ion-item>
	  <ion-label>Exam type</ion-label>
	  <ion-select [(ngModel)]="catSelected" (ionChange)="catselected(catSelected)">
		<ion-option *ngFor="#item of items;#i=index" value="{{i}}">{{item}}</ion-option>
	  </ion-select>
	</ion-item>
</ion-list>

When I change the value of Select menu, It shows Alert with radio. But When I click on OK, it is not working. Alert dialogue box does not disappears.

But if I simply call doRadio from a button click, it works fine. What is the problem ?

1 Like
2

The reason for this is most likely because you are triggering a new animation when the last one has not completed. I would recommend that you rather use a promise to open the alert that way the view has time to catch-up and register the alerts event listeners. This code should help you:

alert.dismiss().then(() => {
     this.testRadioOpen = false;
     this.testRadioResult = data;
});
2 Likes
3

Thanks for the answer smity.
It really helped me to solve my issue :slight_smile:
i am just posting link to my issue so that others can get benifit from it :wink: