Ho un modulo con un paio di pulsanti e sto usando jQuery Validation Plugin da http://jquery.bassistance.de/validate/ , e voglio solo sapere se c’è un modo per controllare se il modulo è considerato in stato di validità tramite plugin di validazione jquery da qualsiasi posizione nel mio codice javascript.
Usa .valid() :
$("#form_id").valid();
Controlla se il modulo selezionato è valido o se tutti gli elementi selezionati sono validi. validate () deve essere chiamato sul modulo prima di controllarlo usando questo metodo.
Dove il modulo con id='form_id' è un modulo che ha già avuto .validate() chiamato su di esso.
Risposta del 2015: abbiamo questo prontuario sui browser moderni, basta usare l’ API CheckValidity HTML5 di jQuery. Ho anche realizzato un modulo jquery-html5-validity per fare questo:
npm install jquery-html5-validity
Poi:
var $ = require('jquery') require("jquery-html5-validity")($);
allora puoi eseguire:
$('.some-class').isValid() true
metodo valido ().
La risposta @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 }
Per un gruppo di input è ansible 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 usare questo per verificare se il modulo è valido:
if(!$(".form-control").isValid){ return; }
È ansible utilizzare 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
"; } }) return message; }
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 “richiesti” avviene senza interferire con l’invio standard utilizzando i valori del “nome” del modulo.
Per Magento, controlli la validazione del modulo con qualcosa di simile in basso.
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!