Wrong position of cursor after scroll with opened keyboard

1

I’m facing an issue where the cursor of the input field is getting wrong positioned (see screenshot afterwards).
To reproduce just do the following:

  • Focus an input field (keyboard is shown)
  • Navigate to another input fields using the keyboard arrow navigation till the window scrolls
  • Tap on the first input field with the finger
  • The cursor is positioned somewhere on top of the first input field rather than inside

2

Hey thanks for pointing this out!
Theres been a lot of work done to tap/scrolling/keyboard issues. Do you mind giving this a shot with the nightly builds?

  <link href="http://code.ionicframework.com/nightly/css/ionic.css" rel="stylesheet">
  <script src="http://code.ionicframework.com/nightly/js/ionic.bundle.js"></script>
3

Fantastic! The issue is gone - thank you very much!!!

PS: I’ve noticed the tabs are no longer displayed now on my iPad running iOS 7.1 since I’ve upgraded to the todays nightly. But I think this isn’t any related - I’ll open up a new thread for this.

4

Hey there,

I see that this issue is resolved, however I am close to a release using ionic vs. 1.0.0-beta.3. Is it possible to apply a patch to beta.3 with this fix? I’d really like to get this issue resolved, but since we’re already into QA I can’t update the entire ionic version.

Thanks for all your work on this project, it has been a lifesaver!

5

Well you should be able to update the beta 6 with out any issues. I’d highly suggest that instead of trying to go back and patch things up.

6

Hi,

I am also having same issue in rc 5, when keyboard is open and i scroll my view up than cursor goes on top of navigation bar. Please help

image

7

Having the same issue in v1.6.1

8

Same issue here when I swipe right to get left side Menu

9

Hi,

I am facing this problem with keyboard, that hides my input field on focus.
But, if I use those nightly links I can resolve this issue.

May I use those links in production ? Or there is a link to download those files ?

10

I have the same issue here after scrolling when focusing an input

element.bind("focus", function(e){
    $ionicScrollDelegate.scrollBy(0, 100, true);
});

So the cursor is displayed on the wrong place (the old place before scrolling).

I am using ionic (LIB 1.3.0), (CLI 1.7.14) on ios 9.2 (simulator and iPad).

11

I have the exact same problem as iouhammi. I am using ionic lib 1.3.1, CLI 1.7.15. The problem only happens on iOS devices, either simulator or real device.

12

Exactly the same issue with ionic 1.3.1 on iOs 9+ (both simulator and device)

1 Like
13

The same issue here with iOS 10! Any ideas?

14 
window.addEventListener('native.keyboardshow', function () {
    document.body.classList.add('keyboard-opened');
    /*
     * This code is a hack to fix the cursor issue.
     * When we click on the input field and keyboard appears, the cursor most of the time is not on the right position.
     * It simply needs to refresh UI once. There was no solution to this problem, so I tried a hack, and it worked. ;)
     * i.e. disable it for 10 micro secs and then re-enable it.
     */
    if (document.activeElement.nodeName === 'INPUT') {
        setTimeout(function (){
            document.activeElement.disabled = true;
            setTimeout(function () {
                document.activeElement.disabled = false;
            }, 10);
        }, 350);
    }
});

I fixed the caret issue this way. Although this is a hack, but fixed for me. :wink:

2 Likes
15

You sir, are… my… hero…