jQuery表单验证-如果发生错误则阻止表单提交

Question

I am using a jquery plugin to validate my form. I want to prevent the user from submitting the form if there are conditions not met with the validation. Here is a piece of code I used in validation

      $(function() {
        $("#register-form").validate({
            rules: {
                OMNI_FIRSTNAME: {
                    required: true,
                    minlength: 2,
                    maxlength: 50
                },
                OMNI_LASTNAME: {
                    required: true,
                    minlength: 2,
                    maxlength: 50
                },  
            messages: {
                OMNI_FIRSTNAME: "Please enter first name",
                OMNI_FIRSTNAME: {
                    required: "Please provide firstname",
                    minlength: "Firstname must be at least 2 character long",
                    maxlength: "Firstname reached maximum length of 50 characters long" 
                },
                OMNI_LASTNAME: "Please enter last name",
                OMNI_LASTNAME: {
                    required: "Please provide lastname",
                    minlength: "Lastname must be at least 2 character long",
                    maxlength: "Lastname reached maximum length of 50 characters long"  
                },
            submitHandler: function(form) {
                form.submit();
            }
        });
      });

The code above outputs messages to my form whenever a condition is not met. I have a submit button in my form $('#register-form') that posts the data entered from the input fields ( OMNI_FIRSTNAME , OMNI_LASTNAME ). How will I integrate the two processes into one? currently, I can still post data that did not meet my jquery validation.

Answer 1

Make following changes in your jquery code

submitHandler: function(form) {

    form.preventDefault();
    form.submit();
}