I create a form validation for my app. Now I test it for mobile devices. There is form with several fields and a “Submit” button below. When I click the button and the required field is empty, field.focus() method invoked. Focus causes scrolling to the field by design. It works fine on android devices on any browser, but there’s no scroll to field on ios browsers (safari and chrome as well), only when I already focused on this field. When field was not focused originally, it works fine.
There’s a picture to better understand the problem
-
Tap on ‘name’ field
-
Keyboard opens so field goes beyond view
-
Tap on ‘submit’ and app call field.focus()
-
I expect view scroll to ‘name’ field (that’s how .focus() should work and it work on android or desktop, but not in ios) but it doesn’t happen
I tried to call field.scrollIntoView(), but it cancells field.focus(). I cant find a way to make them works together
What should I do?
Thank you in advance!