Question

I am fairly new to jQuery and JavaScript in general.

I have a form, and what I want to do it have the form run a function to make sure everything is there, and all the variables are correct then submit.

I have used onclick value to the submit button and have it run a function that uses preventDefault(). I am not sure if im using it correctly but it doesn’t seem to be working.

This is what I have and when you click submit, it just submits even if the if statement is false.

function checkSubmitStatus() {
    $("#myform").submit(function(event){
        if( whatever==true) {
            event.preventDefault(); 
        }
    });
}

<input type="submit" name="submit" value="Submit"  onClick="checkSubmitStatus()">

Thanks!

Answer 1

By putting $("#myform").submit(...) inside the checkSubmitStatus() function, you’re attaching the submit handler after the button is clicked and the form is already submitted. Try this:

<script type="text/javascript">
$(document).ready(function() {
  $("#myform").submit(function(event){
    if(whatever) { 
       event.preventDefault();  
    }  
  });
});
</script>

<form id="myform">
  <input type="submit" name="submit" value="Submit">
</form>