On mobile, when there is a required field that isn’t completed/selected, and it is out of screen view, (so you’ve scrolled past it and are clicking a submit button on the bottom of the page). What happens is that it pops up the keyboard, even if it isn’t a keyboard entry field that’s required. If the field is in view, it does show the validation error. It works on desktop (Mac browser), not on mobile (iOS Chrome/Safari). Here are screenshots:
Here the keyboard pops up after I click on the “continue pre-order” button:
Hey Suzan, we made an update so the keyboard doesn’t appear anymore on button group errors. I’m seeing that the error does appear though, even when scrolled down
Thanks Peter, the keyboard is gone, but the error message still isn’t showing up for me. My guess is that it actually is showing up, but that scrolling back up makes the error disappear before the buttons are in view, this is based on what I’m seeing on the iPad. On the iPad, in portrait mode, I can just see the bottom of the button group and it does show the error message, the moment I touch the screen to scroll up it disappears. If I turn the iPad to landscape view, I never see the error message.
These are other things I tested on two iPhones:
Also, if one of the buttons (comfortable/tighter fit) isn’t selected, then it doesn’t show the error message for the next blank field even if that field is visible on the screen.
If I DO select one of the buttons (comfortable/tighter fit) and then leave the next fields blank, when I click the “continue pre-order” button, it does what you would expect:
it scrolls up to the first blank field, arm circumference, shows “this field is required” and pops up the keyboard (as it should)
then it goes to the next blank field, underbust circumference, and shows “field is required” message, with the keyboard pop-up (as it should)
then it goes to the gender dropdown and shows “this field is required” but no keyboard pop-up since it is a dropdown (as it should)
(The only difference between the button group and the other error messages is that for the button group I created a custom validation error).
I’m on the latest iOS, on 2 iPhones (13 mini and a 15) cleared history, in Safari. I am testing it directly on the form.feathery.io site (not embedded)
I believe that’s what’s happening as well. However, when i tested it, the form autoscrolls to the button group field to display the error when it triggers.
I pressed the button once, waited a few seconds, then pressed it twice more, then manually scrolled back up. The button is mostly covered by the form name overlay but you can see it changes color after I press it to a darker red. No validation error message, and it doesn’t automatically scroll back up to the missing field.
