Inputs, scrolling and the onscreen keyboard on Android

ionic-v1
1

Hello,

I have some issues while testing my very first Ionic app in an HTC running Android 4.0.3

I created 1 directive with a template that is similar to


    
        
Title

    
    
        
          Street

The first few items work, and get a blue line around them when clicked and the screen keyboard appears.

But when I touch one further down the screen scrolls up (moving the input out of the way of the on-screen keyoard) and the blue box is in the wrong place.
And when I scroll further down and I try to click one of those input fields for editing, it picks the wrong field, it scrolls to the wrong place and you don’t know which field you are actually editing.

Very annoying of course (the app is pretty much unusable)

Does that sound familiar to anyone, and does anyone have a solution?

Oh yes, and I created the app using ionic cli, so it contains this as mentioned in the docs:

# IMPORTANT
app.run( ( $ionicPlatform ) ->
  $ionicPlatform.ready( () ->
    if ( window.cordova && window.cordova.plugins.Keyboard )
      # Hide the accessory bar by default (remove this to show the accessory bar
      # above the keyboard for form inputs)
      window.cordova.plugins.Keyboard.hideKeyboardAccessoryBar( true )

      # Don't remove this line unless you know what you are doing. It stops the viewport
      # from snapping when text inputs are focused. Ionic handles this internally for
      # a much nicer keyboard experience.
      cordova.plugins.Keyboard.disableScroll( true ) # originally TRUE, but let's try what happens with FALSE

    if ( window.StatusBar )
      window.StatusBar.styleDefault()
  )
)