Problem with scrolling to next/previous input controls with ios virtual keyboard


I use ionic keyboard plugin. There are few issues with a virtual keyboard though. Precisely with ‘previous/next’ input controls. First of all, I cannot hide an action bar, as it’s only a way to select a value from a drop down combo.

Secondly, I cannot enable auto scrolling with Keyboard.disableScroll(false), because in this case it’s possible to scroll below a bottom margin, after using the ‘prev/next’ controls: a grey area appears (this is definitely another bug).

And at the same time, when I use ‘prev/next’ arrows, a form (not a view) scrolls down to selected control fine, BUT it does not scroll up at all! Input focus jumps to a previous control, but form stucks in a previous position. It leads to losing focus above a top margin of a view. This is the problem.

Let’s do not scroll entire view with header. It’s ok. It’s desired behavior. But, let form scroll to selected control in both directions.


Please give me some idea why do you apply this styles to ion-content element while a virtual keyboard is open? height: 221px; overflow: visible; If I remove them in Web Inspector, there is no problem with the grey area in emulator nor on a real device. I can pull the content, and no grey area appears.

And also I think you should change this details.isElementUnderKeyboard = (details.elementBottom > details.contentHeight); to details.isElementUnderKeyboard = (details.elementBottom > keyboardGetHeight()); In tis case you will NOT need to add a temporary limit to content height. AND also add a check whether the element is above a viewport. Please don’t forget about PREV/NEXT arrow on a virtual keyboard. May be focusin or ionic.focusin events are raised in a different way in this case…

PS It seems that unwilling grey area height corresponds to a header height, but a page where issue takes place has no header. It’s hidden with has-nav-bar=false