jQuery validation onblur

Question

Próbuję uzyskać walidację jQuery działającą na stronie, którą tworzę. Mam około 6 różnych zestawów pól, które zawierają szczegóły strony. Używam tego, ponieważ ukrywam się i pokazuję, że dają lepsze wrażenia użytkownika.

Mam wtyczkę działającą tak, jak chcę za każdym razem, gdy próbuję przesłać stronę i gdy dodaję pojedynczy znak (gdy pole tekstowe wymaga 2 lub więcej znaków), jednak chcę, aby sprawdzanie poprawności odbywało się onblur. Chcę natychmiast powiadomić moich użytkowników, jeśli nie spełnili warunku zatwierdzenia, aby mogli go natychmiast naprawić i nie musieli wracać.

Czy ktoś może mi powiedzieć, co muszę zrobić? Używam wtyczki * http://bassistance.de/jquery-plugins/jquery-plugin-validation/.

Jest to kod jQuery pisałem do tej pory:

 $("#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" 


      } 

      } 


     }); 

jakieś wskazówki?

Answer 1

Nie widzę niczego w dokumentach, które mogą to zrobić. Jedyny inny sposób, w jaki mogę to zrobić, to.

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

Answer 2

Diver Dan miał rację

$('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

Można także skorzystać z połączenia elementów z walidatora.

$('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

Wystarczy ustawić na 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 
     });