Geek asks and answers

How to clear error when using jquery validate and custom errorPlacement

I use jquery and validate to validate my form. Instead of adding an element to the missing field, I add a border to the element using this errorPlacement option

$("#signup-form").validate({
       submitHandler: function(form) {
      form.submit();
   },
   errorPlacement: function(error, element) {
      element.css("border", "solid 1px red");
   }                    
});

The only thing I can’t understand is to clear it when it is valid?

So, I started with the above code. Then I tried, and I am confused by the results. If I do not have the option success:if the field is unsuccessful, it successfully adds the class. But as soon as I add a parameter success, all the required fields get this class, and if I check the element, I see <input class="required invalid valid">, so I'm doing something wrong.

           $("#signup-form").validate({
                submitHandler: function(form) {
                    // do other stuff for a valid form
                    //form.submit();
                },
                errorPlacement: function(error, element) {
                    element.addClass("invalid");
                },        
                success: function(error) {
                    // change CSS on your element(s) back to normal
                },                    
                 debug:true
            });
+5
source share
1 answer

.validate()...

success: function(error) {
    // change CSS on your element(s) back to normal
}

. , .

.

- jsFiddle. jsFiddle .validate() .

OP jsFiddle, ...

    errorPlacement: function(error, element) {
        $(element).filter(':not(.valid)').addClass("invalid");
    },
    success: function(error) {
        console.log(error);
        $("#signup-form").find('.valid').removeClass("invalid");
    }

: http://jsfiddle.net/u3Td3/6/

: HTML. " " input />. , , </input>. . validator.w3.org HTML. table , CSS.

+6

More articles:


All Articles