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();
      }

jquery.validate 验证（支持前台js验证通过，然后ajax后台数据校验）

标签：

原文地址：http://www.cnblogs.com/bingguang/p/4218050.html