2011-01-21 15 views
5

Sto usando il jQuery Form Wizard 3.0.4 plugin per un processo di registrazione a più fasi. Utilizza il plugin validatore jQuery integrato, che funziona bene quando si passa da un passaggio all'altro. EDIT: significa che sto già utilizzando validationEnabled: true, formOptions e validationOptions, e questi funzionano. Devo eseguire questa stessa convalida al di fuori delle normali funzionalità.Come eseguire jquery validate() mentre si utilizza la procedura guidata modulo?

Il problema è che ho bisogno di eseguire il validatore e mostrare gli errori manualmente in due punti. Per un campo speciale che ho, e prima di un invio AJAX. Ho provato la seguente, che non fa nulla:

$("#registrationForm").validate(); 

Lo script Creazione guidata Maschera (jquery.form.wizard-3.0.4.js) sembra essere fare questo quando si va al passo successivo:

this.element.validate().focusInvalid(); 

Così ho provato questo, che fa anche altro:

$("#registrationForm").element.validate().focusInvalid(); 

Tutte le idee?

  1. Come si esegue la stessa convalida che si verifica quando si fa clic sul passaggio successivo?
  2. Come chiamerei una funzione che convalida e mostra gli errori per un campo specifico?
+0

E 'possibile e fattibile usare jQuery FormWizard plug-in pagine jQm? Se è così, sarà troppo pesante per la pagina mobile? – Raman

risposta

3

Penso che il seguente codice di esempio dovrebbe funzionare probabilmente per te, la convalida viene attivata quando si fa clic sul pulsante o sull'elemento con id = "validate_form". Questo è fondamentalmente il codice che viene eseguito (nel plugin) quando l'utente fa clic su Avanti.

$(function(){ 
     $("#validate_form").click(function(){ // when the button is clicked... 
      var wizard = $("#demoForm"); // cache the form element selector 
      if(!wizard.valid()){ // validate the form 
       wizard.validate().focusInvalid(); //focus the invalid fields 
      } 

     }) 
    }) 

Se si sarebbe solo bisogno di validare un campo di input singolo allora si potrebbe utilizzare il seguente codice (il pulsante con id = "validate_email" viene cliccato in questo caso):

$(function(){ 
     $("#validate_email").click(function(){ // when the button is clicked... 
      var wizard = $("#demoForm"); // cache the form element selector 
      if(!wizard.validate().element("#myemail")){ // validate the input field 
       wizard.validate().focusInvalid(); // focus it if it was invalid 
      } 

     }) 
    }) 

Spero che questo aiuta.

/gen

0

Hai esaminato la documentazione del plug-in? C'è un semplice passaggio nella configurazione che ti consentirà di eseguire questo tipo di convalida quando definirai la procedura guidata del modulo.

http://thecodemine.org/#_demoForm=first

Poi clicca su "Opzioni" e guardare il 'validationEnabled' per abilitare la convalida e poi guardare 'validationOptions' per impostare le opzioni.

+0

Sì, lo sto già facendo: "Usa il plugin validatore jQuery integrato, che funziona bene quando si passa da un passaggio all'altro." – jwinn