$ionicModal inputs disappear when keyboard active

ionic-v1
1

Hi, I have a form with one input in an $ionicModal. The modal displays properly but as soon as tap the input to enter text and the keyboard appears, everything in the modal disappears. If I type some text, and close the keyboard, then tap the modal, everything reappears. Any suggestions?

2

Just for those who may have a similar issue, in my modal html I wrapped everything in the ion-content tag. Removing that tag solved the issue.

3

Hey! I ran into the exact same problem and indeed your suggestion does help but I would like to say that removing the <ion-content tag would not be adviseable.

Instead, I took a look at CSS generated for the modal-wrapper and it happens to be due to the keyboard shrinking the view size when the input gains focus.

To my use case all I had to do was to add the following css:

<style>
  ion-modal-view {
    height: 100vh !important;
  }
</style>