zoukankan      html  css  js  c++  java
  • jquery validate 之多tab页同时校验问题

    1、设置多tab页同时校验:

    $("form").validate({ignore: ":hidden", ignore: ""});

    由于使用多tab页时,会存在隐藏域,jquery validate默认是不对隐藏域校验的;以上参数便是加入对隐藏域的校验。

    2、多tab页校验,会存在校验提示定位问题,即如果多个tab页同时有不满足校验时,如何实现自动跳转到不满足校验的tab页。思路:根据第一个不满足校验条件的元素所在tab页,查找其在所有tab中的排序位置,然后模拟对应位置的tab点击事件,参考代码:

    $("form").validate({ignore: ":hidden",

               ignore: "",
                 showErrors: function(errorMap,errorList) {

              //此方法处理所有不满足校验的元素
                 var i = 0;
                 for(var key in errorMap){
                    //alert("属性:" + key + ",值:"+ errorMap[key]); 
                    if(i == 0){

                    // 所有tab页的内容域

                    var conents =  $("div.tab_tontent > div");

                    // 所有tab页头

                    var tabs = $("div.tab_menu ul li");       
                        var index = conents.index(conents.has("[name='"+key+"']"));
                        tabs.eq(index).click();
                    }
                    i++;
                 }
                 this.defaultShowErrors();
                }

              });

      以上是在实际项目中使用jquery validate.js遇到的问题和处理方法,特别提醒下errorMap中存的是不满足校验的元素name和校验提示信息的键值对,为了更好的定位多tab页,各个元素的name要求尽量不相同。

  • 相关阅读:
    光棍节奉献10款chart插件 节日快乐.
    平安夜分享2款下拉菜单(CSS版本和JQuery版本)
    MVC 中T4扫盲贴
    解析JQuery 的Bind()事件
    Null在从数据库读取的时候的一点点小阴谋
    JQuery 动画效果集锦
    VS2010支持的6款UML简介
    T4系列文章之2:T4工具简介、调试以及T4运行原理
    既然结构也可以继承接口
    css float 之 clear
  • 原文地址:https://www.cnblogs.com/xtreme/p/4554731.html
Copyright © 2011-2022 走看看