When inputting info into a wix contact form on mobile (e.g. name, email, message etc) I find that you must press the submit button TWICE in order to get it to send. It appears that the first press is to get focus back to the form (so closing the screen keyboard) and the second press to actually activate the send button. This is bad as users might think the message is sent on first press… Does anybody know a solution to this?
This does happen on some Android devices, I use Samsung phones and it happens on all of my mobiles with a button click or adding text etc. I have also had people test websites on Samsung tablets and it too does the exact same thing when viewed on there.
Not sure about all Android phones or Apple phones either, so it might be a problem elsewhere too.
It isn’t an error with your code and it isn’t something that Wix can fix by adding code which is particular to that make/model of phone or os etc, regardless of if you have coded your site for all versions or if you have coded your page for a particular version through the form factor function and designed a page for mobile viewing only etc.
It is due to the browser being used, in my case Samsung on Android which automatically enlarges an area of the mobile website when a button is pressed or text is needed to be added, so that you can then select the appropriate area and then the page goes back to that area or you need to press the enlarged button again.
It is something that I have tried to turn off myself through the phone settings and Android settings etc, however it seems it can’t be done, so the only workaround is to limit what the user has to input or has to press for example.
Yes I know that it is a very big annoying bug to have to put up with, however if Wix could do something to sort it themselves, then they very much would have already done it and given us code examples or settings in the editor itself already.
The issue here really falls down onto the mobile phones themselves and the company that is responsible for the os that you are using like Android and Samsung if it is their browser or Google if you use Chrome on mobile etc.
Thanks for this, it is very helpful. So based on your reply I’ve had a think at a workaround - if you use the onMouseIn event on the send button (limit it to just mobile obviously) then this captures the change of focus from the screen keyboard and onto the send button:
export function button1_mouseIn(event) {
if (wixWindow.formFactor === "Mobile") {
// some code here, either so submit the form,
// or draw users attention to push the button again
}
}
If I can figure out how to submit a contact form in code, then this solves my problem without users ever having to actually press the button, but if not I can use this method above at least to flash the button or similar to prompt them to press again.
(the only slight issue I can see is that some browsers have Next/Previous buttons on the screen keyboard to change focus, so this will cause the form to send, but if the button is the last item then I’d rather this than not get the message)
I found a solution that works well for me:
export function button1_mouseIn(event) {
if (wixWindow.formFactor === "Mobile") {
let puffOptions = { "duration": 850, "delay": 350 }
$w('#textPressSend').show('puff', puffOptions)
$w('#button1').style.borderColor = "red"
}
}
export function button1_click(event) {
if (wixWindow.formFactor === "Mobile") {
$w('#textPressSend').collapse()
$w('#button1').style.borderColor = "#D3A738"
}
}
#textPressSend is just a little reminder text next to the button, hidden by default.
If the user clicks on the button but it does NOT send (and only gains focus) it registers as a mouseIn event, which you can use to trigger a remedy (in my case flashing the text and changing the send button to red)
If it does register as a click (either first time or second time) the click event collapses the text and reverts the colours (important to use collapse since mouseIn and click events my happen almost simultaneously so hide() isn’t guaranteed ). I then also display a lightbox with success message.
Works well. Just important to use formFactor cause if not the mouseOver will trigger in Desktop mode.