jquery.validate 验证(支持前台js验证通过,然后ajax后台数据校验)

下载 jquery-validation-1.13.1 demo 包。

看到 jquery-validation-1.13.1\demo\milk\index.html      这个例子 不错,验证成功 打上一个对号。然后看看 后台js 代码 发现

 <script src="../../lib/jquery.mockjax.js"></script>  这是什么 呢,原来 这个 用来 模仿 服务端验证的js ,模拟相应报文。如下:

 $.mockjax({
   url: "emails.action",
   response: function(settings) {
    var email = settings.data.email,
     emails = ["glen@marketo.com", "george@bush.gov", "me@god.com", "aboutface@cooper.com", "steam@valve.com", "bill@gates.com"];
    this.responseText = "true";
    if ($.inArray(email, emails) !== -1) {
     this.responseText = "false";
    }
   },
   responseTime: 500
  });

要验证的 文本框 Id 为 email,所以这里 url 为 "emails.action".(为啥不是email 呢,看看下面: )

var validator = $("#signupform").validate({
   rules: {
    email: {
     required: true,
     email: true,
     remote: "emails.action"
    } 

..........

原来 是email  属性上面定义一个remote  才能支持远程服务端验证  。

上面的都是废话了(我不需要模拟服务端,我就是用服务端啊)

然后参考如下:

http://www.cnblogs.com/xiawuyi/archive/2013/04/01/2990224.html  一个 MVC 的案例。

http://jqueryvalidation.org/remote-method/   官方的例子。

我的例子:

首先 找到 jquery.validate.js 文件  查找 dataType: "json"  然后 注释这行代码(我也不知道为啥它非要支持json,不去默认 text,或者返回数据格式自定义不好吗)

部分代码 如下:

<link href="plug/bootstrap/bootstrap.css" rel="stylesheet" />   你们可以不用
  <script src="js/jquery.min.js"></script>
  <script src="plug/bootstrap/dist/js/bootstrap.js"></script>   你们可以不用
  <script src="plug/jquery-validation/dist/jquery.validate.js"></script>

<input type="text" runat="server" class="form-control" data-rule-email="true" name="inputEmail" id="inputEmail"

 data-msg-email="请输入正确的邮件地址" placeholder="找回密码和注册验证通过的凭据" data-error="sssss" required>

    $(document).ready(function () {
      var validator = $("#form1").validate({
        rules: {
          inputEmail: {
            remote: {
              url: window.location.pathname, type: "post",
              data: {
                inputEmail: function () {
                  return $("#inputEmail").val();
                }
              }
            }
          }
        }
      })
    });

 

 

 

   if (Request.Form["inputEmail"] != null)
      {
        Response.Write(111);  //这里自己   定义 验证方法    就好
        Response.End();
      }

 

转载于:https://www.cnblogs.com/bingguang/p/4218050.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值