How to check if a form is valid programmatically using the jQuery validation plugin

Question

I have a form with a couple of buttons, and I'm using the jQuery validation plugin with http://jquery.bassistance.de/validate/ . I just want to find out if there is any way to check if the form is being considered in valid condition using the jquery validation plugin from anywhere in my javascript code.

Answer 1

Use .valid() :

 $("#form_id").valid(); 

Checks if the selected form is correct or all selected items are valid. validate () must be called on the form before checking it using this method.

If the form with id='form_id' is the form on which .validate() has already been called.

Answer 2

2015 answer: We have it out of the box in modern browsers, just use the HTML5 CheckValidity API from jQuery. I also made the jquery-html5-validity module for this:

 npm install jquery-html5-validity 

Then:

 var $ = require('jquery') require("jquery-html5-validity")($); 

then you can run:

 $('.some-class').isValid() true 

Answer 3

@mikemaccana answer is helpful.

And I also used https://github.com/ryanseddon/H5F . Found at http://microjs.com . This is a kind of polyfill, and you can use it as follows (jQuery is used in the example):

 if ( $('form')[0].checkValidity() ) { // the form is valid } 

Answer 4

valid () method.

http://docs.jquery.com/Plugins/Validation/valid

Answer 5

iContribute: it's never too late for a correct answer.

 var form = $("form#myForm"); if($('form#myForm > :input[required]:visible').val() != ""){ form.submit(); }else{ console.log("Required field missing."); } 

Thus, the basic HTML5 check for required fields is performed without interfering with standard submission using the values ​​of the "name" form.

Answer 6

For a group of logins, you can use an improved version based on @mikemaccana's answer

 $.fn.isValid = function(){ var validate = true; this.each(function(){ if(this.checkValidity()==false){ validate = false; } }); }; 

now you can use this to check if the form is valid:

 if(!$(".form-control").isValid){ return; } 

You can use the same method to get all error messages:

 $.fn.getVelidationMessage = function(){ var message = ""; var name = ""; this.each(function(){ if(this.checkValidity()==false){ name = ($( "label[for=" + this.id + "] ").html() || this.placeholder || this.name || this.id); message = message + name +":"+ (this.validationMessage || 'Invalid value.')+"\n<br>"; } }) return message; } 

Answer 7

For Magento, you validate form validation as shown below.

You can try this:

 require(["jquery"], function ($) { $(document).ready(function () { $('#my-button-name').click(function () { // The button type should be "button" and not submit if ($('#form-name').valid()) { alert("Validation pass"); return false; }else{ alert("Validation failed"); return false; } }); }); }); 

Hope this helps you!