MVVM架构~knockoutjs系列之扩展ajax验证~验证输入数据是否与后台数据相等-白红宇

在看这篇文章之前,你有必要先看之前文章是将一个方法以参数的形式传给KO,然后返回一个真假值,去做验证,这类似于面向对象语言里的委托,在JS里我们叫它回调方法,本篇文章与前一文章不同,需要有两个参数,其一是远程方法的签名(JS方法),其二是已知要比较的数据(可能是加密后的密码数据),当用户输入文字后,它将会调用JS方法获取远程数据,以比较原数据与你输入的数据是否匹配.

知识点:以对象作为参数进行传递

ko.validation.js的扩展

//ajax相等验证    kv.rules['ajaxDataEqual'] = {        validator: function (val,params) {            var result = true;//默认为验证通过            $.when(params.ajaxMethod(val)).then(function (data) {                result = kv.utils.isEmptyVal(val) || data == kv.utils.getValue(params.otherValue); //val为空走reqired逻辑,不为空再走ajax逻辑            });            return result;        },        message: 'Two value must equal.'    };

HTML代码

最后程序运行的结果

本实例可以帮助我们完成类似支付,提现等功能模块的验证工作.

对于上面的业务大家可能会有些疑惑，怎么把密码暴露到前端了，当然这只是个实例，在项目中，我们应该使用ajaxData进行真假值的验证，密码的验证应该放到后端的方法里，下面是项目中的代码

self.Paypassword = ko.observable().extend({                ajaxData: { params: confirmPassword, message: "支付密码不正确..." },                required: {                    params: true,                    message: "请输入支付密码..."                }            });

function confirmPassword(key) {            return $.ajax({                url: "/ef/ConfirmPassword",                data: { key: key },                type: "get",                dataType: "json",                async: false,                success: function (data) {                    return data;                }            });        }

下面是Ｃ#后端代码，完成了密码的验证

///         /// 得到用户的支付密码        /// 只返回真假值，不返回加密后的密码        /// 
        ///         /// 
             public JsonResult ConfirmPassword(string key)        {            string oldPassword = "zzl123";//! 这个密码一般是通过当前登陆ＩＤ从数据库里查询出来的，不会暴露在前端            if (key == oldPassword)                return Json(true, JsonRequestBehavior.AllowGet);            else                return Json(false, JsonRequestBehavior.AllowGet);        }

本文转自博客园张占岭（仓储大叔）的博客，原文链接：，如需转载请自行联系原博主。

知识点:以对象作为参数进行传递

ko.validation.js的扩展

HTML代码

相关JS调用时的代码

最后程序运行的结果