Ionic v3, confirm/cancel alert box not appearing in the middle in iOS devices

Question

Ionic v3. It only happens when I put text box in the alert. Alert box appears on the top in regular devices like iPhones. It works fine when I build for android. Checkbox, radio button etc works fine and alert box appears in the middle. Can anyone please tell me why? Is this anything to do with Ionic v3?

I tried to apply cssClass to override the position. But, then screen flickers when user tries to open the keyboard. So, I tried to keep the text box in the alert unfocused by keeping the keyboard closed when alert appears. Still no luck.

Please refer the image for the same.

Answer 1

it seems this is an ongoing issue in Ionic as you can see in https://github.com/ionic-team/ionic/issues/10187 and https://github.com/ionic-team/ionic-v3/issues/980

Apparently, you're facing a case of "it's not a bug, it's a feature". Based on the comments there the Ionic team decided that when a dialog has a text input, they should position it on as high as possible to prevent it from overlapping with the keyboard.

There are some workarounds mentioned in the thread but they all cause the flickering you mention.

TL;DR: Yes, it's an Ionic v3 issue.