Exported site: Recaptcha disables required filed check in contact form

Design help Custom code
1

Hi!

I’ve added Recaptcha v2 Invisible to my exported website. It works like charm, the only thing is that the contact form can be sent even with empty fields for some reason. It’s just asking to fill in the captcha and ignores the “required” in the fields settings.

Here is my site share link

I’ve set the Submit button to post , and action to my formmail.php.
I’ve also added two custom attributes to the submit button as it is rquired with my mail script.
Above the submit button is an HTML embed which allows this form to work with my mail script and recaptcha, also sets success and error pages, as well as replyto email.

And lastly , I’ve added this to my custom code in the head. So far I can’t see anything that could prevent the required fields check. Any suggestions? :webflow_heart:

<script src="https://www.google.com/recaptcha/api.js" async defer></script>
<script>
    function onSubmit(token) {
        document.getElementById("email-form").submit();
    }
</script>
2

Hi @radmitry, thanks for the post, can you help to share the site published url, it is sometimes easier to check the root cause by looking at the exported hosted files.

Thanks in advance

1 Like
3

Hi @cyberdave

https://seeing-knowing.com/contact.html

Thanks a lot!

4

Hi @radmitry,

Thanks, well when I try to submit the form that is having the issue, I can see some errors generated in the console with some custom code:

CloudApp

When removing custom code from the custom code section of project settings, the validation starts to work:

CloudApp

So it seems to be custom code related, I would remove all custom code first and then re-export and check if the issue persists.

Then add code fragments back in one at time until the offending custom code that is causing the issue is checked and corrected or removed.

I hope this helps to point you in the right direction

1 Like
5

Thanks a lot @cyberdave I will try that