(iOS) Header moves up on invoking of ionic popup with Keypad

ionic-v1
1

Hi All,

In Detail :-

My Screen has a header and scrollable content with text fields. On Click of text filed, Ionic Popup (Sample code attached) gets invoked.

If I try to invoke keypad by clicking on the input field of the popup. My Header will moves up and can’t be visible. Is there any soultion to avoid moving the header up?

This issue is seen only on iOS, Android is working fine.

Here is the sample code attached.

Html Code:-

<ion-view title="Dashboard">
  <ion-content class="has-header padding">
    <h1>Dash</h1>
    <button ng-click="showPopup()">Header</button>
  </ion-content>
</ion-view>

Controller code :

    $scope.showPopup = function() {
      $scope.data = {}
      // An elaborate, custom popup
      var myPopup = $ionicPopup.show({
        template: '<input type="password" ng-model="data.wifi">',
        title: 'Enter Wi-Fi Password',
        subTitle: 'Please use normal things',
        scope: $scope,
        buttons: [
          { text: 'Cancel' },
          {
            text: '<b>Save</b>',
            type: 'button-positive',
            onTap: function(e) {
              if (!$scope.data.wifi) {
                //don't allow the user to close unless he enters wifi password
                e.preventDefault();
              } else {
                return $scope.data.wifi;
              }
            }
          },
        ]
      });
      myPopup.then(function(res) {
        console.log('Tapped!', res);
      });
 };
2

You can disable the native scrolling

.run(function($ionicPlatform) {
  $ionicPlatform.ready(function() {
    // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
    // for form inputs)
    if(window.cordova && window.cordova.plugins.Keyboard) {
      cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
     // Disables the native overflow scroll, not the js scroll
      cordova.plugins.Keyboard.disableScroll(true)
    }
    if(window.StatusBar) {
      // Set the statusbar to use the default style, tweak this to
      // remove the status bar on iOS or change it to use white instead of dark colors.
      StatusBar.styleDefault();
    }
  });
})