2010-05-04 6 views
7

le plug-in de validation jQuery pour une utilisation dans notre projet.délégués Personnalisation de l'événement dans le Je suis en train actuellement plug-in validation jQuery

Par défaut, il y a des événements automatiquement mis en place pour le traitement. C'est à dire. focus in/out, key up des événements sur toutes les entrées de validation incendie. Je ne veux que déclencher lorsque le bouton Soumettre est cliqué.

Cette fonctionnalité semble être construit dans le plug-in, ce qui rend difficile de le faire (sans modifier le plug-in code, pas ce que je veux faire).

J'ai trouvé la fonction eventDelegate appelle la méthode du code plugin prototype:

 $(this.currentForm) 
      .validateDelegate(":text, :password, :file, select, textarea", "focusin focusout keyup", delegate) 
      .validateDelegate(":radio, :checkbox, select, option", "click", delegate); 

Lorsque je supprime ces lignes du plug-in que je reçois mon résultat, mais je ferais bien plutôt quelque chose en dehors du bouchon -in pour y parvenir.

Quelqu'un peut-il s'il vous plaît me aider? Si vous avez besoin de plus de détails, s'il vous plaît faites le moi savoir. J'ai cherché google avec peu de succès.

Merci

EDIT: j'essaie essentiellement de valider le formulaire uniquement lorsque le soumettre événement est déclenché. Par défaut, le plug-in valide chaque foyer de temps est perdu dans un contrôle d'entrée.

Répondre

7

a trouvé la réponse. Il était (caché?) Absent dans le cadre des options de la méthode validate.

Voir les options onfocusout etc sur cette page: http://docs.jquery.com/Plugins/Validation/validate#options

que je peux mettre à false.

Voici mon code qui définit mon validateur (je l'espère d'autres trouveront cela utile):

$(document).ready(function() { 
    $("form").each(function() { 
     $(this).validate({ 
      validateDelegate: function() { }, 
      onsubmit: true, 
      onkeydown: false, 
      onkeyup: false, 
      onfocusin: false, 
      onfocusout: false, 

      errorContainer: "#PanelError", 
      errorLabelContainer: "#PanelError ul", 
      wrapper: "li", 
      ignoreTitle: true, 
      errorClass: "Error", 

      highlight: function(element, errorClass, validClass) { 
       $(element).addClass(errorClass).removeClass(validClass); 
       $(element.form).find("#" + element.id) 
         .addClass(errorClass); 
      }, 
      unhighlight: function(element, errorClass, validClass) { 
       $(element).removeClass(errorClass).addClass(validClass); 
       $(element.form).find("#" + element.id) 
         .removeClass(errorClass); 
      } 
     }); 
    }); 
}); 
Questions connexes