关于JQuery validate表单校验插件对级联下拉框的校验问题

简介: 关于JQuery validate表单校验插件对级联下拉框的校验问题

今天在使用JQuery validate表单校验插件时,遇见了一个非常诡异的问题了。在此记录一下:


         问题描述:

22.jpg

                 


                如上图所示,行部类别和所属行部2项,存在级联关系,根据用户选择的不同行部类别显示不同的所属行部。


                第一次选择营业部时,会对所选择的所属行部正确进行校验。选择“河南支行”,出现校验不通过标识。


                当改变行部类别时,会重置所属行部,


                第二次行部类别选择网点时,所属行部再次选择“河南支行”,也出现了校验不通过标识。注意:正常情况是能够通过校验的。


                         通过使用fire bug查看校验请求发现,当第二次再次选择所属行部时,由于选择了和上次一样的值(“河南支行”),并没有再次发送校验请求,就直接重现了上次校验的结果。


                原因分析:


                          导致这样的结果,主要是由于JQuery validate表单校验插件对下拉框重新选定的值如果和上一次的值一样,就不会触发校验方法,不会根源remote向后台发送校验请求。而是直接还原上次校验的结果。


                        不能说这样的机制不好,它减少了不必要的网络校验的请求,减轻了服务器的压力。那么在针对这种特殊的下拉框级联校验我们该怎么解决呢?


               解决方案:


                      根据上面的分析,我们只要能去掉所属机构下拉框对于上次选择结果的记忆就可以了。 当行部类别改变导致所属机构重置时,加上如下这段代码:


if($.data(document.getElementById("supBdt"), "previousValue"))
               {
               $.data(document.getElementById("supBdt"), "previousValue").old = null; 
         }

                        其中,supBdt是所属机构下拉框的id。


                      这样就能完美解决这个问题了。

目录
打赏
0
0
0
0
24
分享
相关文章
|
2月前
jQuery+Slick插件实现游戏人物轮播展示切换源码
jQuery+Slick插件实现游戏人物轮播展示切换源码
47 14
|
3月前
|
jquery文字动画特效插件animatext
jquery文字动画特效插件animatext
90 9
简单易用的jquery响应式轮播图插件ma5slider
ma5slider是一款简单易用的jquery响应式轮播图插件。该轮播图支持鼠标拖拽,可以通过CSS定制外观,支持无限循环模式,内置水平,垂直和淡入淡出三种轮播图过渡动画效果。
jQuery文字跑马灯插件Marquee
jQuery.Marquee是一款jQuery文字跑马灯插件。jQuery.Marquee跑马灯插件可以结合使用CSS3动画,制作文字的上下左右移动效果。
jquery和CSS3图片排序过滤搜索插件
Filterizr是一款jquery和CSS3图片排序过滤插件。它可以对一组图片进行排序,按条件过滤和按关键字搜索。并在显示结果时使用指定的CSS3动画过渡效果。
39 2
jquery和CSS3响应式轮播图插件jcSlider
jcSlider是一款jquery和CSS3响应式轮播图插件。jcSlider使用CSS3过渡动画,它可以和animate.css完美结合,生成60多种轮播图过渡动画效果。
jQuery消息通知显示插件
MessageNotifyPlugin是一款简单的jQuery消息通知显示插件。该jQuery消息通知显示插件能够自动生成最新消息和提醒消息两个消息通知按钮。并且可以设置消息的是否已读状态等
38 2
JQuery操作下拉框
转载自下面的链接,很有用的。 http://www.cnblogs.com/yrhua/archive/2012/11/04/2753571.html 要实现这种效果: HTML代码 1 2 3 4 5 ...
864 0
jquery操作下拉框
jQuery获取Select选择的Text和Value:语法解释:1. $("#select_id").change(function(){//code...});   //为Select添加事件,当选择其中一项时触发2.
1179 0
jQuery和CSS3滑动展开菜单按钮插件
这是一款jQuery和CSS3滑动展开菜单按钮插件。该滑动展开菜单按钮在用户点击主菜单按钮之后,子菜单以滑动的方式依次展开
77 21
AI助理

你好,我是AI助理

可以解答问题、推荐解决方案等