web-dev-qa-db-fra.com

comment vérifier si un formulaire est valide par programme à l'aide de jQuery Validation Plugin

J'ai un formulaire avec quelques boutons et j'utilise le plugin jQuery Validation de http://jquery.bassistance.de/validate/ . Je veux juste savoir s’il est possible de vérifier si le formulaire est considéré comme valide par le plug-in de validation jQuery à partir de n’importe où dans mon code javascript.

74
Jaime Hablutzel

Utilisez .valid() :

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

Vérifie si le formulaire sélectionné est valide ou si tout est sélectionné les éléments sont valables. validate () doit être appelé sur le formulaire avant le en vérifiant en utilisant cette méthode.

Où le formulaire avec id='form_id' est un formulaire sur lequel .validate() a déjà été appelé.

106
Andrew Whitaker

Réponse 2015: nous avons cette solution prête à l'emploi sur les navigateurs modernes, utilisez simplement l'API HTML5 CheckValidity de jQuery. J'ai également créé un module jquery-html5-valid pour le faire:

npm install jquery-html5-validity

Ensuite:

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

alors vous pouvez lancer:

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

true
31
mikemaccana
5
ysrb

La réponse @mikemaccana est utile.

Et j'ai aussi utilisé https://github.com/ryanseddon/H5F . Trouvé sur http://microjs.com . C'est une sorte de polyfill et vous pouvez l'utiliser comme suit (jQuery est utilisé dans l'exemple):

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

iContribute: Il n'est jamais trop tard pour une bonne réponse.

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

Ainsi, la validation HTML5 de base pour les champs "obligatoires" s'effectue sans interférer avec la soumission standard à l'aide des valeurs "nom" du formulaire.

4
juan.benavides

Pour un groupe d'entrées, vous pouvez utiliser une version améliorée basée sur la réponse de @ mikemaccana

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

vous pouvez maintenant l'utiliser pour vérifier si le formulaire est valide: 

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

Vous pouvez utiliser la même technique pour obtenir tous les messages d'erreur:

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

Pour Magento, vous vérifiez la validation du formulaire par quelque chose comme ci-dessous.

Vous pouvez essayer ceci: 

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

J'espère que cela peut vous aider!

0
Kazim Noorani