Scroll to the focused item input when the keyboard is up

For the most part it should work yes, as ngif, ngmodel are Angular JS components, not Ionic made. Not sure about FormGroup & Validators, though.

when I change htmls inputs to ion-input all inputs with type different from
text stoped to work, I can not select this ion-input to fill the form, I
think ion-input using ionic v1 only works with type=“text”

Diego Felix de Almeida
+556183798073

The most easiest solution:
When keyboard is open, the body has class “keyboard-open”. Track if it has that class and move with css to top.

E.g. in index.html:


  <script>
      setInterval(function(){
      if( document.body.className.match('keyboard-open') ) {
      document.getElementById("messagearea").style.marginBottom="100px";
      }
                  else{
                     document.getElementById("messagearea").style.marginBottom="0px";
                  }
  
                  }, 1000);

  </script>

I LITERALLY WENT THROUGH 100 answers before I had to find answer myself. so here it is how to disable scroll of UI on IOS.
simply when cordova is loading, add this.
Please install:
cordova plugin add ionic-plugin-keyboard --save

and then do cordova prepare to load this new plugin in your www folder.

 document.addEventListener('deviceready', function(e){
    window.addEventListener('native.keyboardshow', function () {
            cordova.plugins.Keyboard.disableScroll(true);
        });
});

Just add this properties to your ionicModule in app.module.ts. works for me.

IonicModule.forRoot(MyApp, {
      scrollAssist: false, 
      autoFocusAssist: false
    })
2 Likes

Hi, I tried with this solution but its not wroking out…

try this inside the constructor of app.component.ts

      window.addEventListener('keyboardDidShow', () => {
        document.activeElement.scrollIntoView(false);
      });
2 Likes

Hi,
Thanks a lot…Its working good.

Add the following properties to ionicModule in app.module.ts.
IonicModule.forRoot(MyApp, {
scrollAssist: false,
autoFocusAssist: false
})

added the following inside the constructor of app.component.ts
document.addEventListener(‘deviceready’, function(e){
window.addEventListener(‘native.keyboardshow’, function () {
cordova.plugins.Keyboard.disableScroll(true);
});
});

Setting scrollAssist and autoFocusAssist works for me. Thank you.

If you are using Capacitor, you just need to install the Keyboard plugin & it should fix the issue.
PS: just installing the plugin will do the trick, you don’t have to use it anywhere.