使用自定义方法扩展JQuery Validator插件

时间:2022-11-28 15:15:33

I added a custom validation method to validate a password. However, it does not matter if the JSON I get is:

我添加了一个自定义验证方法来验证密码。但是,如果我得到的JSON是:

{"success":true}

or:

{"success":false}

The field password never validates.

字段密码永远不会验证。

$(document).ready(function() {
    // Ad custom validation
    $.validator.addMethod('authenticate', function (value) { 
    $.getJSON("./json/authenticate.do",{ password: value},function(json) { 
                return (json.success == true) ? true : false;}
            ); 
    }, 'Wrong password');

    $('form#changePasswordForm').validate({
            rules: {
                 repeat_new_password: { equalTo: "#new_password"    },
                 password :  {authenticate: true}
        }, submitHandler: function(form) {
                    $(form).ajaxSubmit( {
                            dataType: "json", 
                            success: function(json) {
                            alert("foo");
                    }
        });                     
    }
});         
});

Any idea, what I am doing wrong?

任何想法,我做错了什么?

1 个解决方案

#1


7  

What you do wrong is that when you add your custom method you never return true or false from it. You return it in the ajax callback.

你做错了是当你添加自定义方法时,你永远不会从中返回true或false。你在ajax回调中返回它。

$.validator.addMethod('authenticate', function (value) { 
    $.getJSON("./json/authenticate.do",{ password: value }, function(json) { 
        // This return here is useless
        return (json.success == true) ? true : false;
    }); 
    // You need to return true or false here...
    // You could use a synchronous server call instead of asynchronous
}, 'Wrong password');

Instead of adding a custom method you could use the remote function:

您可以使用远程功能,而不是添加自定义方法:

$('form#changePasswordForm').validate({
    rules: {
        repeat_new_password: { 
            equalTo: "#new_password" 
        },
        password : { 
            // This will invoke ./json/authenticate.do?password=THEVALUE_OF_THE_FIELD 
            // and all you need to do is return "true" or "false" from this server script
            remote: './json/authenticate.do' 
        }
    }, 
    messages: { 
        password: { 
            remote: jQuery.format("Wrong password")
        }
    },
    submitHandler: function(form) {
        $(form).ajaxSubmit({
            dataType: "json", 
            success: function(json) {
                alert("foo");
            }
        });                     
    }
});   

You can check it out in action here.

你可以在这里查看一下。

#1


7  

What you do wrong is that when you add your custom method you never return true or false from it. You return it in the ajax callback.

你做错了是当你添加自定义方法时,你永远不会从中返回true或false。你在ajax回调中返回它。

$.validator.addMethod('authenticate', function (value) { 
    $.getJSON("./json/authenticate.do",{ password: value }, function(json) { 
        // This return here is useless
        return (json.success == true) ? true : false;
    }); 
    // You need to return true or false here...
    // You could use a synchronous server call instead of asynchronous
}, 'Wrong password');

Instead of adding a custom method you could use the remote function:

您可以使用远程功能,而不是添加自定义方法:

$('form#changePasswordForm').validate({
    rules: {
        repeat_new_password: { 
            equalTo: "#new_password" 
        },
        password : { 
            // This will invoke ./json/authenticate.do?password=THEVALUE_OF_THE_FIELD 
            // and all you need to do is return "true" or "false" from this server script
            remote: './json/authenticate.do' 
        }
    }, 
    messages: { 
        password: { 
            remote: jQuery.format("Wrong password")
        }
    },
    submitHandler: function(form) {
        $(form).ajaxSubmit({
            dataType: "json", 
            success: function(json) {
                alert("foo");
            }
        });                     
    }
});   

You can check it out in action here.

你可以在这里查看一下。