html/javascript onsubmit event not called on form submit to validate form

Question

I want to do a very basic validation of a form in html and javascript.

I want a text field to be checked when the submit button is clicked, and the action of the form to be performed if the check is valid, and nothing to happen if not.

For some reason however the onsubmit event of the form does not seem to be triggered at all.

One of the reasons might be that the submit button starts as disabled, but gets enabled by the recaptcha callback function after completion of recaptcha. How would I get around that?

This is my code (I have simplified it to a minimum to test, and nothing happens, the function is not called as the window alert is not popping up:

<script type="text/javascript">
   function capcb() {
       document.getElementById("cap_sub").disabled = false;
    };                                 
</script>
<script type="text/javascript">
    function check() {
        window.alert("checking");
        return false;
    }
</script>
[...]
<form action="submitpage.php" method="post" onsubmit="return check()">
  <fieldset>
    <input type="text" name="Email" id="email" maxlength="120" class="input" /></p> 
  </fieldset>
  <div align="center" class="g-recaptcha" data-sitekey="masked" data-size="compact" data-callback="capcb"></div>
  <input type="submit" id="cap_sub" value="Submit!" class="submit"/>
</form>

Loooking forward to your suggestions !

I am not sure what you mean since it gets triggered for me, see this fiddle. Could you post your complete markup or create a fiddle, please? — Anonymous

John123 John123 · Accepted Answer · 2018-02-12T22:36:15

Maybe because you have a semicolon at the end of the function capcb()? Because i tried your code and its working.

<script type="text/javascript">
   function capcb() {
       document.getElementById("cap_sub").disabled = false;
    }                                
</script>

html/javascript onsubmit event not called on form submit to validate form

2 Answers