CODEWITHSUNDEEP
phpjqueryjoomla2.5
Raaman Rai
Raaman Rai

Reputation: 215

Prevent form submission using jQuery

I am validating my form using jquery as below:

jQuery(document).ready(function(){
        jQuery('#adminform').validate({

        rules: {
          name: {
            minlength: 5,
            maxlength: 30,
            required: true
          },
          username: {
            required: true,
            minlength: 5,
            maxlength: 30
          }
        },
        highlight: function(label) {
            jQuery(label).closest('.control-group').addClass('error');
        },
        success: function(label) {
            label
                .text('OK!').addClass('valid')
                .closest('.control-group').addClass('success');
        },
        messages:{

          name: {
            required: "Enter your name"
          },
          username: {
            required: "Enter a username"
          } 
       }
      });     
});

now how should I prevent the form from submission if the rules are not meet?

When I click the submit button nothing should happen.

Upvotes: 2

Views: 2389

Answers (4)

Jai
Jai

Reputation: 74738

Your code is perfect just a submit trigger needed : http://jsfiddle.net/uUdWN/

jQuery(document).ready(function() {
jQuery('#adminform').validate({
    rules: {
        name: {
            minlength: 5,
            maxlength: 30,
            required: true
        },
        username: {
            required: true,
            minlength: 5,
            maxlength: 30
        }
    },
    highlight: function(label) {
        jQuery(label).closest('.control-group').addClass('error');
    },
    success: function(label) {
        label.text('OK!').addClass('valid').closest('.control-group').addClass('success');
    },
    messages: {
        name: {
            required: "Enter your name"
        },
        username: {
            required: "Enter a username"
        }
    }
});


$("#adminform").submit(); // <-------------just triggered submit

});

Upvotes: 0

Ryan
Ryan

Reputation: 14649

Prevent form submission using jQuery?

$('#myFormId').submit(function(event) {
     event.preventDefault();
 });

OR:

$('#myFormId').submit(function()
{
    return false;
});

Upvotes: 2

rOcKiNg RhO
rOcKiNg RhO

Reputation: 631

Prevent the submit event and remain on the screen

e.preventDefault();

what about this?

Upvotes: 1

Tom Walters
Tom Walters

Reputation: 15616

To stop a form being submitted you use:

return false;

When you know the input is invalid.

Upvotes: 2

Related Questions