CODEWITHSUNDEEP
jquery-validate
Mark Chorley
Mark Chorley

Reputation: 2107

Jquery validation: call equalTo method from a custom validation method

I want a validation method which will check that two fields are equal then hide one of them. At the moment I use equalTo to check they are equal. So I planned to add a validation method which delegates to equalTo and hides the field depending on the result.

The problem I have is that I cannot work out how to call equalTo on the correct instance of the validator. When I call it, I always see an error in equalTo, "this.settings is not defined". This is equalTo 

 // http://docs.jquery.com/Plugins/Validation/Methods/equalTo
        equalTo: function( value, element, param ) {
            // bind to the blur event of the target in order to revalidate whenever the target field is updated
            // TODO find a way to bind the event just once, avoiding the unbind-rebind overhead
            var target = $(param);
//error here   
            if ( this.settings.onfocusout ) {
                    target.unbind(".validate-equalTo").bind("blur.validate-equalTo", function() {
                        $(element).valid();
                    });
                }
                return value === target.val();
        },

Here is my code. 

// validate form
$.validator.addMethod("equalToAndHide", function(value, element, param) {
   //this does not work
   var result = $.validator.methods.equalTo.call(value, element, param);
   if(result === true){
        $(element).hide();
   }
   return result; 
 }, $.validator.format("Values must be equal_???"));

 $('form').validate({
                        rules : {

                        confirmEmail : {
                            equalToAndHide : utils.byId("alternateEmail")
                        }
                    },
                    submitHandler : function(form) {
                        accordionAjax.post($(form));
                    }
                });

I would prefer to leave equalTo as it is rather than override it and amend the call to this.settings, if possible.

Upvotes: 0

Views: 1947

Answers (1)

Sparky
Sparky

Reputation: 98718

You don't need to call the original equalTo from within your custom method... just write a whole new function using the original as your basis.

This is the default equalTo function...

function( value, element, param ) {
    var target = $(param);
    if ( this.settings.onfocusout ) {
        target.unbind(".validate-equalTo").bind("blur.validate-equalTo", function() {
            $(element).valid();
        });
    }
    return value === target.val();
}

Put it inside your custom method and tweak it to suite your needs...

$.validator.addMethod("equalToAndHide", function(value, element, param) {
        var target = $(param);
        if ( this.settings.onfocusout ) {
            target.unbind(".validate-equalTo").bind("blur.validate-equalTo", function() {
                $(element).valid();
            });
        }
        return value === target.val();
        $('#whatever').hide();
}, $.validator.format("Values must be equal_???"));

Upvotes: 2

Related Questions