资讯专栏INFORMATION COLUMN

表单 验证 函数

luck / 1270人阅读

摘要:验证示意代码设备编码长度为的编码目录信息设备编码属性的主要写法包括必填必填,正确的经度在中已经定义必须为整数必填,最大长度英文,中文必填,最小长度英文,中文主要的组件代码不能为空必须为整数不是合法的数字不是合法

(验证)html 示意代码
*

ui-validate 属性的主要写法包括:

ui-validate="required"  //必填

ui-validate="{pattern: "required,longitude"}"  //必填 ,正确的经度 (longitude 在validatePatterns中已经定义)

ui-validate="{pattern: "integer"}" //必须为整数

ui-validate="{pattern:"required", maxlength:50}" // 必填,最大长度 50(英文1,中文2)

ui-validate="{pattern:"required", minlength:50}" // 必填,最小长度 50(英文1,中文2)
主要的组件html

js 代码
var validatePatterns = { 
        "required":     [/^[S+s*S+]+$/ig, "不能为空!"],
        "integer":      [/^(0|[1-9][0-9]*)$/, "必须为整数!"],    
        "numeric":      [/^d+(.d+)?$/, "不是合法的数字!"],
        "currency":     [/^d+.d{1,2}$/, "不是合法的货币数字!"],
        "email":        [/^w+@w+(.w+)*$/, "不合法的email输入!"],
        "phone":        [/^((0d{2,3})-)?(d{7,8})(-(d{3,}))?$/, "电话不合法!"],
        "mustChecked":  [/0+/g, "checkbox不能为空!"],
        "mustSelected": [/0+/g, "select不能为空!"],
        "ipAddress":    [/^([1-9]|[1-9]d|1d{2}|2[0-1]d|22[0-3])(.(d|[1-9]d|1d{2}|2[0-4]d|25[0-5])){3}$/, "不是有效的IP地址!"],
        "netport":      [/^([0-9]|[1-9]d|[1-9]d{2}|[1-9]d{3}|[1-5]d{4}|6[0-4]d{3}|65[0-4]d{2}|655[0-2]d|6553[0-5])$/, "不合法的端口!"],
        "mac":          [/^[0-9,a-f,A-F]{2}[-][0-9,a-f,A-F]{2}[-][0-9,a-f,A-F]{2}[-][0-9,a-f,A-F]{2}[-][0-9,a-f,A-F]{2}[-][0-9,a-f,A-F]{2}$/, "不合法的mac地址!"], 
        "year":         [/^(d{4})$/, "年份不合法!"],
        "mouth":        [/^(d{4})-(0d{1}|1[0-2])$/, "月份不合法!"],
        "date":         [/^{d}{4}-{d}{2}-{d}{2}$/, "日期不合法!"],
        "timeHour":        [/^(0d{1}|1d{1}|2[0-3])$/, "小时不合法!"],  //HH
        "timeMinute":    [/^(0d{1}|1d{1}|2[0-3]):([0-5]d{1})$/, "分钟不合法!"], //HH:mm
        "timeSeconds":  [/^(0d{1}|1d{1}|2[0-3]):[0-5]d{1}:([0-5]d{1})$/, "时间不合法!"], //HH:mm:ss
        "chineseOnly":    [/[^u4E00-u9FA5]/g, "输入不合法!请只输入中文!"],
        "mobilePhone":  [/^(0|86|17951)?(13[0-9]|15[012356789]|17[678]|18[0-9]|14[57])[0-9]{8}$/, "手机号不合法!"],
        //"unicomPhone":  [/^13[0-4]{1}[d]{8}$/, "不合法!"],
        //"telecomPhone": [/^(d{7,8})|(d{3,4}-d{7,8})$/, "不合法!"],
        "specials":     [/^[^`~!@#$%^&*()+=|][]{}:;",.<>?]{1}[^`~!@$%^&+=][{}:;",<>?]{0,}$/, "不能输入特殊字符!"],
        "pattern":      [null, "数据不合法!请确认"],
        "carCode":      [/^[u4e00-u9fa5]{1}[A-Z]{1}[A-Z_0-9]{5}$/, "车牌号格式不正确"],
        "idCard":       [/(^d{15}$)|(^d{18}$)|(^d{17}(d|X|x)$)/, "身份证号格式不正确"],
        "postcode":     [/^d{6}$/, "邮编格式不正确"],
        "longitude":    [/^-?((180(.0{0,6})?)|((d{1,2}|1[0-7]d)(.d{0,6})?))$/, "不是有效的经度!"],
        "latitude":     [/^-?((90(.0{0,6})?)|((d|[1-8]d)(.d{0,6})?))$/, "不是有效的纬度!"],
        "digitOrLetter":[/^[A-Za-z0-9]*$/,"格式不正确(只支持数字或字母)"],
        "passport":        [/^(Pd{7})|(Gd{8})$/,"护照格式不正确"],
        "hk-passport":    [/^[a-zA-Z0-9]{5,21}$/,"港澳通行证格式不正确"],
        "driving":        [/^[a-zA-Z0-9]{3,21}$/,"驾照格式不正确"]
    };

/**
     * 表单验证
     * ui-validate 属性, minlength, maxlength,min (最小值),max (最大值)
     * 如果不需要验证隐藏项,flag需要传递值,默认不传值,兼容适用于tab页面切换的情况
     */
    this.validateForm = function($form,flag){
        
        var checkAll = true;
        $form.find("[ui-validate]").each(function(){
            if(flag){
                if($(this).is(":hidden")){
                    return ;
                }
            }
            var validate = $(this).attr("ui-validate");
            
            var pattern = $(this).attr("ui-pattern");
            
            var objectReg = new RegExp(/{.*}/g);
            
            var name = $(this).attr("name");
            
            var vtext = $(this).attr("ui-vtext");
            
            var type = $(this).attr("type") || $(this)[0].tagName;
            
            if(vtext == undefined || vtext == null || vtext == ""){
                vtext = name;
            }
            
            var value = $.trim(getFormValue($(this)));

            function getPattern(p){
                var reg = null;
                p = $.trim(p);
                if(p == "pattern") {
                    reg = [eval("/" + pattern + "/i"), validatePatterns["pattern"][1] ];
                } else {
                    reg = validatePatterns[p];  
                }
                if(reg == null) {

                    var msg = "[" + vtext + "]验证Pattern配置错误:" + p;
                    UI.util.alert(msg, "warn");

                    throw new Error(msg);
                }
                return reg;
            }
            
            var pats = null;
            var allPatterns = "";
            if(objectReg.test(validate)){
                validate = eval("(" + validate + ")");
                
                if(validate.min && !isNaN(validate.min) && value != ""){
                    if(value < validate.min){
                        UI.util.alert("[" + vtext + "]不能小于" + validate.min, "warn");
                        $(this).focus();
                        checkAll = false;
                        return false;
                    }
                }
                
                if(validate.max && !isNaN(validate.max) && value != ""){
                    if(value > validate.max){
                        UI.util.alert("[" + vtext + "]不能大于" + validate.max, "warn");
                        $(this).val(validate.max);
                        $(this).focus();
                        checkAll = false;
                        return false;
                    }
                }
                if(validate.minlength && !isNaN(validate.minlength) && value != ""){
                    if(value.length < validate.minlength){
                        UI.util.alert("[" + vtext + "]不能少于" + validate.minlength + "个字符!", "warn");
                        $(this).focus();
                        checkAll = false;
                        return false;
                    }
                }
                
                if(validate.maxlength && !isNaN(validate.maxlength) && value != ""){
                    //中文字符算两个字符,英文和数字算一个字符
                    var len = value.length;
                    var blen = 0; 
                    for(i=0; i validate.maxlength){
                        UI.util.alert("[" + vtext + "]不能超过" + validate.maxlength + "个字符!", "warn");
                        $(this).focus();
                        checkAll = false;
                        return false;
                    }
                }
                
                if(validate.pattern){
                    pats = validate.pattern.split(",");
                }
                
                allPatterns = validate.pattern;
            } else {
                pats = validate.split(",");
                
                allPatterns = validate;
            }
            
            if(allPatterns != null && allPatterns.indexOf("required") >= 0 || value != "") {
                if(pats != null){
                    for(var i = 0; i < pats.length; i++){
                        
                        var reg = getPattern(pats[i]);
                        if(!value.match(reg[0]) || (value.match(reg[0])==-1) && type =="SELECT"){
                            var vinfo = $(this).attr("ui-vinfo");
                            if(vinfo == undefined || vinfo == null || vinfo == ""){
                                vinfo = "[" + vtext + "]" + reg[1];
                            }
                            UI.util.alert(vinfo, "warn");
                            checkAll = false;
                            return false;
                        }
                    }
                }
            }
            
        });
        
        return checkAll;
    }
使用方式
if (!UI.util.validateForm($(".dataForm"))) {
            return;
  }  
(获取)html 代码
*
函数代码
this.formToBean = function($form){

        var bean = {};
        
        var checkedValue = 1;
         
        $form.find("input, select, textarea, .ui-rating, .ui-switch, .dropdown-tree, .filtertag")
        .each(function(){
            if($(this).is("[ui-ignore]")){
                return ;
            }
            var name = $(this).attr("name");
            var type = $(this).attr("type") || $(this)[0].tagName;
            
            if(type == "button" || type == "reset" || type == "submit"){
                return ;
            }

            var value = getFormValue($(this));
            
            if(value != null){
                if(typeof value == "string"){
                    value = $.trim(value);
                }
                if(type == "checkbox"){
                    if(bean[name] == undefined){
                        bean[name] = value;
                    } else {
                        bean[name] += "," + value;
                    }
                } else {
                    bean[name] = value;
                }
            }
        });

        return bean;
    }


function getFormValue($elem){
        var type = $elem.attr("type") || $elem[0].tagName;
        
        if(type == "radio"){
            if($elem.is(":checked")){
                return $elem.val();
            }
        } else if(type == "checkbox"){
            if($elem.is(":checked")){
                return $elem.val();
            }
        } else if(type == "ui-rating") {
            return $elem.rating("getValue");
            
        } else if(type == "ui-switch") {
            return $elem.uiswitch("getValue");
            
        } else if(type == "dropdown-tree") {
            return $elem.find(".tree-title").attr("title");
            //return $elem.dropdowntree("getSelectIds");
        } else if(type == "filtertag") {
            return $elem.filtertag("getSelectFilter");
            
        } else if( type == "SELECT" || type == "select"){
            var value = $elem.val();
            
            if( Object.prototype.toString.call(value).toLowerCase() == "[object array]"){

                var value = value.join(",");
            }
            return value;
            
        }else {
            return $elem.val();
        }
        return null;
    }
调用方法
var params = UI.util.formToBean($(".form-inline"));
得到的值
{
    SBMC:value
}

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/89118.html

相关文章

  • 实用的表单验证插件--jquery Validation

    摘要:默认值原生的表单提交类型表单验证通过后提交表单的回调函数。使用去控制这个组的验证信息被放置的位置。例子禁用对焦验证。他的回调函数被传入两个参数类型元素这个元素是当前正在被验证的,是一个元素。此函数的上下午为验证对象本身。 Validation文档翻译 前言 Validation作为表单验证中最常用的插件,为我在开发过程中提供了很多便利的地方。虽然说我很常用,但是我真的不敢说我会用Val...

    eccozhou 评论0 收藏0
  • python大佬养成计划----flask应用(表单)

    摘要:特别是可以访问请求提交的表单数据。表单的代码生成和验证提交的表单数据就是两个很好的例子。优势扩展使得处理表单能获得更愉快的体验。设计了表单库来使可以更加简便地管理操作表单数据。 1. 为什么使用Flask-WTF? request对象公开了所有客户端发送的请求信息。特别是request.form可以访问POST请求提交的表单数据。 尽管Flask的request对象提供的支持足以处理w...

    alighters 评论0 收藏0
  • Flask Web Development —— Web表单(上)

    摘要:每个表单域都可以连接到一个或多个是一个用于检查用户提交的输入是否合法的函数。表单域构造函数的第一个参数是一个,在渲染表单到时会使用。验证确保提交的表单域不为空。表单域验证都是直接从包中导入。表格展示了一组支持的标准表单域。 第二章中介绍的request对象公开了所有客户端发送的请求信息。特别是request.form可以访问POST请求提交的表单数据。 尽管Flask的request...

    CODING 评论0 收藏0
  • 【译】WTForms 2 中文入门教程(速成课程)

    摘要:你打了个响指然后开始致力于你想写的棒极了的网络应用程序你写完一些页面最后你需要着手处理令人讨厌的任务处理和验证表单输入进入开始但是为什么我需要另一个框架呢好吧一些网络应用程序框架采用数据库模型和表单处理相结合的方法同时这对很基本的创建更新视 你打了个响指, 然后开始致力于你想写的棒极了的 Python 网络应用程序. 你写完一些页面, 最后你需要着手处理令人讨厌的任务:处理和验证表单输...

    enda 评论0 收藏0
  • JavaScript 设计模式系列 - 策略模式与动态表单验证

    摘要:策略模式又称政策模式,其定义一系列的算法,把它们一个个封装起来,并且使它们可以互相替换。的表单具有表单验证功能,用来校验用户输入的表单内容。实际需求中表单验证项一般会比较复杂,所以需要给每个表单项增加自定义校验方法。 showImg(https://segmentfault.com/img/remote/1460000020135990); 策略模式 (Strategy Pattern...

    宋华 评论0 收藏0

发表评论

0条评论

luck

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<