Setting the focus on an input field when it is clicked


I have a register section in my app where the user types in his/her details. However when you click on an input field and start typing information into it, it is hidden by the keypad. How can i scroll/focus to have the input field higher in the page and above the keypad when it is clicked?

Thank you


I just experienced the same problem, and because I didn’t find any solution I’ve made a directive.

The idea is to add a temporary element at the bottom of the .scroll-content created by the ion-content element at the exact height of the keyboard, and then make the view scroll to center the input in the visible area.

You can find it here:

Hope it helps.