Cursor does not follow input when scrolling with $ionicScrollDelegate on iOS

[AgDude]

This is the same problem as described in #26 and #1063. It seems that it was fixed for scrolling by the user, but if the scroll is done programatically the problem still occurs.

here is a snippet from a directive:

var scroller = $ionicScrollDelegate.$getByHandle('my-handle'),
      setTop = function(){
        var top = element[0].getBoundingClientRect().top;
        if ( top > 62){ scroller.scrollBy(0, top - 62, true); }
      };

When setTop is called, the scroll happens, but cursor stays in the original position (no longer over the input).

[sloops77]

Hi, just upgraded to beta14. This fix screws up my chat app that where the selected input is outside the scroll area (in a footer). By screws up I mean: removes focus from the input. Even better because I hook into onBlur events and setFocus i get into an infinite loop. IMHO blurring of activeElements would be better achieved as a directive rather than on the raw scrollDelegate API which should just do what it says on the tin (manage the scroll area).

[cquartier]

I agree with @sloops77, I have a chat-based app and have the exact same problem with this fix

[pulakb]

@sloops77 can you please share the solution in codepen?

[sloops77]

Unfortunately the way i've fixed this is by using a fork of ionic (or hack your copy of ionic).

see this commit on my own fork sloops77@c96af22. you can cherrypick it if u like.

Note that my fork of ionic also contains commits for trigger.io support which you probably dont want

[adamdbradley]

@AgDude Would you be able to put together a codepen replicating the issue? Thanks

[Ionitron]

Greetings @AgDude!

My sensors indicate a reply was requested, but we have not received one yet, I am using my robot powers to close this issue. However, if you are still experiencing this issue, please feel free to reopen it by creating a new issue, and include any examples or necessary information.

Thank you for allowing me to assist you.

[kunj77]

I am facing the exact same issue. Is there a solution for this yet?

[Stephs15]

I am facing this same issu in android. Any solutions?

[piyushmanurkar]

Any update on this??? I am facing the exact same issue in iOS...

[VinceOPS]

Same here with ionic 1.3 and iOs 9.3...

[VinceOPS]

Hi there!
Just to say that the issue also exists on Android with overflow-scroll set to false

[jdnichollsc]

same issue with iOS 10 and ionic 1.3

[ManivannanP]

I faced the same issue in all ios devices with ionic 1

[VinceOPS]

Looks like it's a bug from webkit in Safari mobile:
https://bugs.webkit.org/show_bug.cgi?id=138201#c5

(http://openradar.appspot.com/18819624)

It will probably never be fixed (lasting since iOS 7).
The only workaround (given by the community) seems to consist in hiding the cursor by triggering blur(), and then focusing again (focus()) when scroll is done...

[JaswinderImmanent]

I am facing the same issue.The input field cursor scroll with screen in IOS device in ionic 1 and IOs 10.
Unable to find any solution.Please help as soon as possible.

Thanks in advance.

[ionitron-bot]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.