jquery validate 验证实例 --记录是否已存在

　　jQuery Validate 插件为表单提供了强大的验证功能，让客户端表单验证变得更简单，同时提供了大量的定制选项，满足应用程序各种需求。该插件捆绑了一套有用的验证方法，包括 URL 和电子邮件验证，同时提供了一个用来编写用户自定义方法的 API。

　　对于它基础的验证规则这里不做赘述，主要讲解它的异步验证。

　　需求如下：在一个form表中，需要根据用户ID来验证用户名，若数据库中已存在同样的用户ID对应同样的记录名称，则禁止插入或更新(更新时若记录名未发生改变，则需要再判断是否除此记录之外还存在同名称的记录)。

　　部分jsp页面代码如下：

 <div class="control-group">
        <label class="control-label">userId：</label>

        <div class="controls">
            <form:input path="userId" htmlEscape="false" maxlength="64" class="input-xlarge "/>
            <span class="help-inline"><font color="red">*</font> </span>
        </div>
    </div>
    <div class="control-group">
        <label class="control-label">名称：</label>

        <div class="controls">
            <input type="hidden" id="oldName" name="oldName" value="${doctorPatientRecord.name}"/>
            <form:input path="name" htmlEscape="false" maxlength="100" class="input-xlarge "/>
            <span class="help-inline"><font color="red">*</font> </span>
        </div>
    </div>

　　上面有两个需要用到的标签：userId和name，另外为了更新时是否为改变记录名而添加了一个新的input标签，存放的是原记录名这些标签中有大量的属性设置，其实是非必须的，一定要用到的有标签的name属性，因为jQuery 验证的时候是根据name属性名来查找对象的。

　　jQuery代码如下：

rules: {
                    userId: {required: true, remote: "${ctx}/doctor/doctorpatientrecord/checkUser?"},
                    name: {
                        required: true,
                        remote: {
                            url: "${ctx}/doctor/doctorpatientrecord/checkName",
                            type: "post",
                            dataType: "json",
                            data: {
                                oldName:'${doctorPatientRecord.name}',
                                name: function () {
                                    return $("#name").val();
                                },
                                userId: function () {
                                    return $("#userId").val();
                                }
                            }
                        }
                    }
                },
messages: {
                    userId: {required: "用户ID不能为空", remote: "用户ID不存在"},
                    name: {required: "记录名不能为空", remote: "记录名已存在"}
                },

　　jQuery代码中一共有两个验证，一个是验证userId一个是验证name，也就是我们的需求验证。其中userId的验证看起来很简便，由于个人理解及了解不多，只知道相对于name的验证方式，userId所使用的这种验证方式无法获取到最新的标签值。而在form中，userId的值是默认不会发生改变的，因此可以采用这种方法，userId的值已经传入到后台而不需要特地在url后去添加一个userId=xxxx；

　　name的验证由于要获取到最新的值，因此只能采用这种比较笨重的方法，设置url,跳转方式为post,数据类型为json，需要传递的数据放在data 中，包括：userId，oldName，name。

　　后台接收处理的方法代码如下：

 @RequestMapping(value = "checkUser")
    public String checkUser(String userId) {
        if (userId != null) {
            UserToken userToken = new UserToken();
            userToken.setUserId(userId);
            userToken = doctorUserTokenDao.get(userToken);
            if (userToken != null) {
                return "true";
            }
        }
        return "false";
    }

    /**
     * 验证记录名是否有效
     */
    @ResponseBody
    @RequiresPermissions("doctor:doctorpatientrecord:edit")
    @RequestMapping(value = "checkName")
    public String checkName(String oldName, String name, String userId) {
        if (name != null && name.equals(oldName)) {
            return "true";
        } else if (StringUtils.isNotBlank(name) && StringUtils.isNotBlank(userId)) {
            DoctorPatientRecord doctorPatientRecord = new DoctorPatientRecord();
            doctorPatientRecord.setName(name);
            doctorPatientRecord.setUserId(userId);
            List<DoctorPatientRecord> doctorPatientRecordList = doctorPatientRecordService.findListy(doctorPatientRecord);
            if (doctorPatientRecordList.size() == 0) {
                return "true";
            }
        }
        return "false";
    }

　　jQuery validate 后台验证返回的结果只能是 true 字符串或者false字符串，不能是其他的值。后台接收的参数命名必须和jQuery 传过来的参数保持一致。