This question is locked. New answers and comments are not allowed.
Hi,
How to avoid the view from moving to top when a text input gets focused.
Image Normal.png shows the desired output
Image Issue.png shows the issue
This issue occurs on devices only. (Tested on ipad, ipod)
This issue is replicated using http://demos.telerik.com/kendo-ui/mobile-forms/index
Regards,
Sam
1 Answer, 1 is accepted
0
Hi Sam,
Thank you for contacting Telerik support.
Indeed, this is a behavior that is expected on iOS devices due to the way the WebView handles the focus event on input fields in web pages and hybrid mobile applications. It is implemented with the intent to make visible an input when the keyboard is shown and prevent the keyboard from overlapping the input elements. Usually, there is no need to take further action to prevent this behavior, but in case you need to do this, here are some suggested approaches.
One of the suggested solutions with pure JavaScript (though using jQuery) is to scroll down the page manually. To do this you can subscribe for the event occurring when focusing the input, as suggested here.
When working in the context of a hybrid mobile application you can use the custom Keyboard plugin to capture the Keyboard.onshow and/or onhide events to perform the scrolling. Another approach using the plugin would be to disable the scrolling through the plugin.
I hope that this will be helpful for you. Let me know if I may be of any further assistance.
Regards,
Anton Dobrev
Telerik
Thank you for contacting Telerik support.
Indeed, this is a behavior that is expected on iOS devices due to the way the WebView handles the focus event on input fields in web pages and hybrid mobile applications. It is implemented with the intent to make visible an input when the keyboard is shown and prevent the keyboard from overlapping the input elements. Usually, there is no need to take further action to prevent this behavior, but in case you need to do this, here are some suggested approaches.
One of the suggested solutions with pure JavaScript (though using jQuery) is to scroll down the page manually. To do this you can subscribe for the event occurring when focusing the input, as suggested here.
When working in the context of a hybrid mobile application you can use the custom Keyboard plugin to capture the Keyboard.onshow and/or onhide events to perform the scrolling. Another approach using the plugin would be to disable the scrolling through the plugin.
I hope that this will be helpful for you. Let me know if I may be of any further assistance.
Regards,
Anton Dobrev
Telerik
See What's Next in App Development. Register for TelerikNEXT.