jQuery validation onblur

Question

Sto cercando di ottenere la convalida di jQuery su una pagina Web che sto creando. Ho circa 6 diversi set di campi che contengono i dettagli della pagina. Sto usando questo come sto nascondendo e mostrando loro danno una migliore esperienza utente.

Ho il plugin che funziona come voglio ogni volta che provo a inviare la pagina e ogni volta che aggiungo un singolo carattere (quando una casella di testo richiede 2 o più caratteri) tuttavia voglio anche che la convalida avvenga onblur. Voglio informare immediatamente i miei utenti se non hanno soddisfatto le condizioni di convalida in modo che possano risolverli immediatamente e non debbano tornare indietro.

Qualcuno può dirmi cosa devo fare Sto usando il plug-in * http://bassistance.de/jquery-plugins/jquery-plugin-validation/.

Questo è il codice jQuery ho scritto finora:

 $("#aspnetForm").validate({ 
      rules: { 
      <%=txtFirstName.UniqueID %>: 
       { 
        required: true, 
        minlength: 2 
       } 
       , 
       <%=txtSurname.UniqueID %>: 
       { 
        required: true, 
        minlength: 2 
       } 
       , 
       <%=txtMobileNumber.UniqueID %>: 
       { 
        required: true, 
        minlength: 8 
       } 
       , 
       <%=Email.UniqueID %>: 
       { 
        required: true, 
        email: true 
       } 
       , 
        <%=ddDay.UniqueID %>: 
       { 
        required: true 

       } 
       , 
        <%=ddMonth.UniqueID %>: 
       { 
        required: true 

       } 
       , 
        <%=ddYear.UniqueID %>: 
       { 
        required: true 

       } 
       , 
       <%=txtHouseNumber.UniqueID %>: 
       { 
        required: true, 
        minlength:1 

       } 
       , 
       <%=txtAddress1.UniqueID %>: 
       { 
        required: true, 
        minlength:5 
       } 
       , 
       <%=txtCity.UniqueID %>: 
       { 
        required: true, 
        minlength:2 
       } 
       , 
       <%=txtSuburb.UniqueID %>: 
       { 
        required: true, 
        minlength:2 
       } 
       , 
       <%=txtPostCode.UniqueID %>: 
       { 
        required: true, 
        minlength:4, 
        maxlength:4 
       } 

       , 
       <%=UserName.UniqueID %>: 
       { 
        required: true, 
        minlength:4 

       } 
       , 
       <%=Password.UniqueID %>: 
       { 
        required: true, 
        minlength:4 

       } 
       , 
       <%=ConfirmPassword.UniqueID %>: 
       { 
        equalTo: "ctl00$ctl00$cpMain$cpLeft$Password" 

       } 
        , 
       <%=chkTerms.UniqueID %>: 
       { 
        required: true 


       } 

      }, 
      messages: { 
       <%=txtFirstName.UniqueID %>: 
      { 
       required: "Please enter your firstname", 
       minlength: "Minimum length is 2 characters" 
      }, 
       <%=txtSurname.UniqueID %>: 
      { 
       required: "Please enter your lastname", 
       minlength: "Minimum length is 2 characters" 
      }, 
      <%=txtMobileNumber.UniqueID %>: 
      { 
       required: "Please enter your mobile", 
       minlength: "Minimum length is 8 characters" 
      } 
      , 
      <%=ddDay.UniqueID %>: 
      { 
       required: "Please enter your date of birth" 

      } 
      , 
      <%=txtMobileNumber.UniqueID %>: 
      { 
        required: "Please enter your date of birth" 
      } 
      , 
      <%=txtMobileNumber.UniqueID %>: 
      { 
        required: "Please enter your date of birth" 
      } 
      , 
        <%=Email.UniqueID %>: 
        "Please enter a valid email" 
      , 
      <%=txtHouseNumber.UniqueID %>: 
      { 
        required: "Please enter your house number", 
        minlength:"Please add at least 1 character" 
      } 

      , 
      <%=txtAddress1.UniqueID %>: 
      { 
        required: "Please enter your address", 
        minlength:"Please add at least 5 characters" 
      } 
      , 
      <%=txtCity.UniqueID %>: 
      { 
        required: "Please enter your city", 
        minlength:"Please add at least 2 characters" 
      } 
      , 
      <%=txtSuburb.UniqueID %>: 
      { 
        required: "Please enter your city", 
        minlength:"Please add at least 2 characters" 
      } 
      , 
      <%=txtPostCode.UniqueID %>: 
      { 
        required: "Please enter your postcode", 
        minlength:"Please add the 4 required characters", 
        maxlength:"Only 4 characters are allowed" 
      } 
      , 
      <%=UserName.UniqueID %>: 
      { 
        required: "Please enter your username", 
        minlength: "Please add the 4 required characters" 

      } 
      , 
      <%=Password.UniqueID %>: 
      { 
        required: "Please enter your password", 
        minlength: "Please add the 4 required characters" 

      } 
      , 
      <%=ConfirmPassword.UniqueID %>: 
      { 
        equalTo: "Passwords must match" 
      } 
      , 
      <%=chkTerms.UniqueID %>: 
      { 
        required: "Please agree to the terms" 


      } 

      } 


     }); 

Qualche consiglio?

Answer 1

Non riesco a vedere nulla nei documenti che possano farlo. L'unico altro modo in cui posso pensare di farlo è.

$('#field1, #field2, #field3').blur(function(){ 
    validator.validate() 
}); 

Answer 2

Diver Dan era giusto

$('form').validate({ 
    onfocusout: function (element) { 
     $(element).valid(); 
    }, 
    rules: { 
     name: 'required', 
     from: 'required' 

    }, 
    messages: { 
     name: 'Please enter your firstname', 
     from: 'Please enter where are you from' 
    } 
}); 

Answer 3

È inoltre possibile utilizzare la chiamata elemento del validatore.

$('form').validate({ 
     onfocusout: function(element) { 
      this.element(element); 
     }, 
     rules: { 
      name: 'required', 
      from: 'required' 

     }, 
     messages: { 
      name: 'Please enter your firstname', 
      from: 'Please enter where are you from' 
     } 
    }); 

Answer 4

Basta impostare sul onkeyup = false

$('form').validate({ 
    rules: { 
     name: 'required', 
     from: 'required' 

    }, 
     onkeyup: false 
     , 
    messages: { 
     name: 'Please enter your firstname', 
     from: 'Please enter where are you from' 
    } 
}); 

Answer 5

Thia code will not fire validation onkeyup, but on blur "lost focus" the validation will be fire, as will once the user starts to edit the field, validation message will disappear. find more interesting other customization on this ref: https://jqueryvalidation.org/category/plugin/

$('#frm').validate({ 
      onkeyup: false, 
      focusCleanup: true 
     });