When I progress to the last step of my form to collect name, CC, phone number (etc.), the form automatically always jumps to the 3rd blank required field, phone number. This happens across Chrome, Safari, desktop and mobile. So the customer has to go back up, and in the case of mobile, scroll back up, to fill the earlier fields.
Can you share a screen recording? It doesn’t seem to do that for me
Here you go: https://photos.app.goo.gl/weRb56WA4r4cHeDSA
(Happens on Safari and Chrome both. Cleared History)
Unfortunately I can’t reproduce this behavior on mobile or desktop (mac OSX chrome desktop and android chrome mobile). One idea is to turn off autofocus on your form, which you can do in your form settings
Hi Peter, I think the problem might be Safari on both desktop and mobile. Turning off autofocus (and clearing history) does different things on mobile and desktop:
- it does nothing on desktop even after clearing history, still jumps to phone number field
- it does turn off autofocus on mobile, turning it back on, it jumps again to the phone number field
I tried a few more things:
-
Deleting the phone number field to see what would happen. Now when it loads this form step, even though I have autofocus turned on, it doesn’t highlight any field to start with on either desktop or mobile.
-
I toggled autofocus off, then back on (saving, clearing browser history on Safair, and testing each time), didn’t do anything different either on or off when the phone number field was NOT on the step
-
I rebuilt the phone number field element from scratch, once again both on desktop and mobile Safari it goes directly to the phone number field, even with autofocus turned off on desktop, not on mobile. The setting is saved, and cleared history on both desktop and mobile browser.
-
On chrome on mobile it works fine now. On desktop I can’t clear chrome history at the moment
Ah thank you suzan. Was able to see this issue on safari and push up a fix for it
Thank you Peter, one follow-up, now when I progress to that step, it opens up the dropdown automatically like this screenshot when the step loads, is there a way to not have it do this?
That was the fix, to allow dropdowns to be focused so the first field could be focused on the page instead. If you want to prevent that behavior, you could turn off autofocus.
Ideally the first blank field gets the autofocus on the step. When the user gets to this step, the dropdown is already filled in from their interaction with the previous steps in the form, they aren’t likely to want to modify the quantity dropdown(s).
I can try moving the CC information fields above the table to see if that puts the focus in the right place.
Ah that’s a good suggestion, we just updated autofocus to focus on the first empty field instead
1 Like
Hi Peter, in going back through this, it is jumping to the phone number field - I moved the phone number field up from 3rd to 2nd field on the form to test this and it is specific to the phone number field.
It is still happening on:
Mac Desktop Safari
iOS Safari
iOS Chrome
On Mac Chrome it doesn’t jump to any field.
Here it is on iOS Chrome:
Here on iOS Safari:
Here is a recording of Mac Desktop Chrome and Safari side by side, on Safari it jumps to the phone number field, on Chrome it doesn’t jump to any field:
Hi Suzan, we had another minor issue where the payment method field wasn’t autofocusing if it’s the first field. just made a fix for this so LMK if that fixes your issue here
1 Like
Yes, fixed, thank you.