come verificare se un modulo è valido a livello di codice utilizzando jQuery Validation Plugin

Ho una forma con un paio di pulsanti e sto usando jQuery Validation Plugin da http://jquery.bassistance.de/validate/ . Voglio solo sapere se c'è un modo per controllare se il modulo è considerato in uno stato valido dal plug-in di convalida jquery da qualsiasi punto del mio codice javascript.

Utilizzare .valid()dal plugin jQuery Validation:

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

Controlla se il modulo selezionato è valido o se tutti gli elementi selezionati sono validi. validate () deve essere chiamato sul form prima di controllarlo usando questo metodo.

Dove la forma con id='form_id'è una forma che l'ha già .validate()invocata.

Risposta 2015: abbiamo questo fuori dagli schemi sui browser moderni, basta usare l' API CheckValidity HTML5 di jQuery. Ho anche creato un modulo jquery-html5-validity per fare questo:

npm install jquery-html5-validity

Poi:

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

quindi puoi eseguire:

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

true

La risposta di @mikemaccana è utile.

E ho anche usato https://github.com/ryanseddon/H5F . Trovato su http://microjs.com . È una sorta di polyfill e puoi usarlo come segue (jQuery è usato nell'esempio):

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

metodo valid ().

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

iContribute: non è mai troppo tardi per una risposta giusta.

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

In questo modo la convalida HTML5 di base per i campi "obbligatori" avviene senza interferire con l'invio standard utilizzando i valori "nome" del modulo.

Per un gruppo di input puoi utilizzare una versione migliorata basata sulla risposta di @ mikemaccana

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

ora puoi usarlo per verificare se il modulo è valido:

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

Puoi usare la stessa tecnica per ottenere tutti i messaggi di errore:

$.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;
}

Per Magento, controlli la convalida del modulo con qualcosa come di seguito.

Puoi provare questo:

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;
            }
        });
    });
});

Spero che questo possa aiutarti!