Jquery Validate根据其他元素的事件来触发单个元素的异步校验

场景:在做一个车辆信息管理模块,而车牌是通过车牌颜色和车牌号码来确定唯一性的,录入车牌信息时需对车牌进行唯一性校验。

对车牌号的异步校验规则

 1 rules:{
 2             plateNumber:{
 3                 remote:{
 4                     url:‘${ctx}/bu/vehicleInfo/checkPlateNumUniqueness‘,
 5                     data:{
 6                         plateNumber:function(){
 7                             return $("#plateNumber").val();
 8                         },
 9                         plateColor:function(){
10                             return $("#plateColor").val();
11                         }
12                     }
13                 }
14             }
15         },
16         messages:{
17             plateNumber:{
18                 remote:‘已存在相同车牌号码‘
19             }
20         }

车牌颜色变动的时候通过触发车牌号码的校验规则来对唯一性进行校验

$("#plateColor").change(function() {
    //由于是根据车牌号码和车牌颜色来判断车牌号唯一性的,故车牌颜色改变时也应该校验车牌号唯一性
    $("#plateNumber").removeData(‘previousValue‘);
    var plateNum = $("#plateNumber").val();
    if (plateNum != ‘‘) {
        $("#plateNumber").removeData(‘previousValue‘);
        validator.element($("#plateNumber"));
    }
});

这里遇到了一个问题,就是车牌颜色变动过一次触发了唯一性校验之后,再去变动车牌颜色就无法再次触发唯一性校验了,

后来在这里找到了答案(http://stackoverflow.com/questions/2710548/how-do-i-use-jquery-validate-remote-validation-on-a-field-that-depends-on-anothe)

原因是触发了一次之后会有缓存,需要调用这removeData方法先把缓存清理掉才能再次触发。

时间: 2024-10-05 05:22:21

Jquery Validate根据其他元素的事件来触发单个元素的异步校验的相关文章

[记录]jquery validate 不用submit方式验证表单或单个元素

jquery validate 不用submit方式验证表单或单个元素 jQuery validate的版本: v1.14.0 var result = $('#myForm').validate({ errorElement : 'span', errorClass : 'help-block error', rules:{ }, message:{ } }).form(); 具体的内容可以参考官网文档:http://jqueryvalidation.org/documentation/#li

点击子元素事件不触发父元素事件

<html> <head> <meta http-equiv="content-type" content="text/html;charset=utf-8"> <script src="http://cdn.bootcss.com/jquery/2.1.0/jquery.min.js"></script> <style type="text/css">

html事件-子元素事件不触发父元素事件

<div class="list-row" onclick="showChatDialog('dy','100000001',true);"> <img class="icon" src="/icon/default.ico" onclick="personData(event,100000001);"> <a class="nickname">dy&

解决内部元素onMouseOver/onMouseOut事件冒泡触发父元素的相应事件

前阵子为BS项目模板做了一个左侧滑动信息栏,效果类似于windows状态栏的自动隐藏效果,鼠标移进滑出,鼠标移出隐藏,浮动时不占用空间,也可以固定住占一块位置.做的过程中遇到一个问题,鼠标在信息栏内部移动时会触发onMouseOut事件,信息栏放在div中,内部有table.img.a等元素,看来是由于事件冒泡,子元素上触发了事件冒泡到了父元素,导致滑动时不断闪动,头晕眼花,于是着手解决问题. 方法一: 在IE下解决问题很简单,用onMouseEnter.onMouseLeave来代替onMou

鼠标指针被高层元素挡住时,触发下层元素的鼠标事件

在做如下图这种拖拽效果的时候,遇到一个问题: 被拖拽的元素一直位于一个比较高的层,且一直跟随鼠标移动,这样会挡住鼠标,导致其无法触发下层元素的任何事件.这样下层的元素就无法响应拖拽的事件了. 受到这篇文章的启发:http://www.vinylfox.com/forwarding-mouse-events-through-layers/ 最终实现的思路是,在mouseover事件中: 1.隐藏高层元素 2.根据坐标获取当前位置的最高层DOM 3.手动触发事件 element.hide(); va

jquery validate用法总结

jquery validate是本人用过的最好用的验证组件,但其文档写的真是不敢恭维,现将一些常见用法总结如下(持续更新). 1. js触发表单验证 //触发整个表单的验证 $('form').valid() //触发单个元素的验证 $("#form1").validate().element($("#salary")) 2. 不用form的submit提交,用js提交 //绑定form的validate $("#form").validate(

jquery on事件jquery on实现绑定多个事件

API上jquery on介绍 on(events,[selector],[data],fn) 概述 在选择元素上绑定一个或多个事件的事件处理函数. on()方法绑定事件处理程序到当前选定的jQuery对象中的元素.在jQuery 1.7中,.on()方法 提供绑定事件处理程序所需的所有功能.帮助从旧的jQuery事件方法转换,see .bind(), .delegate(), 和 .live(). 要删除的.on()绑定的事件,请参阅.off().要附加一个事件,只运行一次,然后删除自己, 请

jQuery 学习笔记(三)——事件与应用

页面加载时触发ready()事件 ready()事件类似于onLoad()事件,但前者只要页面的DOM结构加载后便触发,而后者必须在页面全部元素加载成功才触发,ready()可以写多个,按顺序执行.此外,下列写法是相等的: $(document).ready(function(){})等价于$(function(){}); 例如,当触发页面的ready()事件时,在<div>元素中显示一句话.如下图所示: 在浏览器中显示的效果: 从图中可以看出,当页面的DOM框架完成加载后,便触发ready(

jquery的bind跟on绑定事件的区别

Jquery的bind跟on绑定事件的区别:主要是事件冒泡(事件代理): jquery文档中bind和on函数绑定事件的用法: .bind(events [,eventData], handler) .on(events [,selector]  [,data], handler) 从文档中可以看出,.on方法比.bind方法多一个参数'selector' .on的selector参数是筛选出调用.on方法的dom元素的指定子元素,如: $('ul').on('click', 'li', fun