2010-05-04 8 views
7

Attualmente sto configurando il plug-in di convalida jQuery da utilizzare nel nostro progetto.Personalizzazione dei delegati dell'evento nel plug-in di convalida jQuery

Per impostazione predefinita, alcuni eventi vengono impostati automaticamente per la gestione. Cioè focus in/out, key up events su tutti gli input fire validation. Voglio che si attivi solo quando si fa clic sul pulsante di invio.

Questa funzionalità sembra essere incorporata nel plug-in, il che rende difficile farlo (senza modificare il codice plug-in, Not What I Want To Do To Do).

ho trovato la funzione eventDelegate chiama il metodo codice del plugin prototipo:

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

Quando rimuovo queste righe dal plugin ottengo il mio risultato, però io preferirei di gran lunga fare qualcosa al di fuori della spina -in ottenere questo.

Qualcuno può aiutarmi per favore? Se avete bisogno di ulteriori dettagli, fatemelo sapere. Ho cercato su Google con scarso successo.

Grazie

EDIT: sto fondamentalmente cercando di convalidare il modulo solo quando l'evento viene generato presentare. Per impostazione predefinita, il plug-in viene convalidato ogni volta che si perde la messa a fuoco in un controllo di input.

risposta

7

Trovato la risposta. Era (nascosto?) Lontano come parte delle opzioni nel metodo di validazione.

vedere le opzioni onfocusout ecc in questa pagina: http://docs.jquery.com/Plugins/Validation/validate#options

che posso impostato su false.

Ecco il mio codice che definisce il mio validatore (si spera altri troveranno questo 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); 
      } 
     }); 
    }); 
});