0

I am trying to build upon this answer: https://stackoverflow.com/a/37048027

The answer worked but I wanted to put in a custom HTML5 validation error message so I expanded the javascript to this: 

 window.onload = function() {
    var $recaptcha = document.querySelector('#g-recaptcha-response');
    if($recaptcha) {
        $recaptcha.setAttribute("required", "required");
        $recaptcha.setAttribute("oninvalid", "this.setCustomValidity('Please fill in the reCAPTCHA field.')");
        $recaptcha.setAttribute("oninput", "this.setCustomValidity('')");
    }
};

The issue is that if the validation error is shown once, it is always shown afterwards and never goes away. I tried adding the oninput, onvalid and onchange but I can't seem to get the error message to go away after the initial showing.

Stepppo
  • 347
  • 1
  • 6
  • 11

1 Answers1

0

You can disable HTML5 form validation by adding novalidate to the form element according to this specification.

For example

<form action="..." onsubmit="check_if_capcha_is_filled" novalidate>
Solomon Tam
  • 739
  • 3
  • 11
  • Thanks but I want the validation. There are other elements on the form and I want to know that the reCAPTCHA worked. – Stepppo Feb 18 '19 at 03:45