jQuery EasyUI---validatebox 校验规则扩展

EasyUI 的 validatebox 插件, 验证规则相对比较单一也比较少,如下。

rules: {
            email:{
                validator: function(value){
                    return ...?$/i.test(value);
                },
                message: 'Please enter a valid email address.'
            },
            url: {
                validator: function(value){
                    return ...?$/i.test(value);
                },
                message: 'Please enter a valid URL.'
            },
            length: {
                validator: function(value, param){
                    var len = $.trim(value).length;
                    return len >= param[0] && len <= param[1]
                },
                message: 'Please enter a value between {0} and {1}.'
            },
            remote: {
                validator: function(value, param){
                    var data = {};
                    data[param[1]] = value;
                    var response = $.ajax({
                        url:param[0],
                        dataType:'json',
                        data:data,
                        async:false,
                        cache:false,
                        type:'post'
                    }).responseText;
                    return response == 'true';
                },
                message: 'Please fix this field.'
            }
        },

自定义校验规则

对validatebox 进行拓展如:在原有的规则上进行拓展增加下面三个验证规则,单独文件 easyui-extend-textbox.js。

(function($) {
	/**
	 * jQuery EasyUI 1.4 --- 功能扩展
	 * 
	 * Copyright (c) 2009-2015 RCM
	 *
	 * 新增 validatebox 校验规则
	 * 
	 * 后面可以增加相应的规则
	 */
	$.extend($.fn.validatebox.defaults.rules, {
		idcard: {
			validator: function(value, param) {
				return /^\d{15}|\d{}18$/.test(value);
			},
			message: '请输入正确的身份证号码'
		},
		checkNum: {
			validator: function(value, param) {
				return /^([0-9]+)$/.test(value);
			},
			message: '请输入整数'
		},
		/**
		 * 1 可以全数字
		 *2 可以全字母
		 *3 可以全特殊字符(~!@#$%^&*.)
		 *4 三种的组合
		 *5 可以是任意两种的组合
		 *6 长度6-22
		 * */
		checkPwd: {
			validator: function(value, param) {
				return /^[\@A-Za-z0-9\!\#\$\%\^\&\*\.\~]{6,22}$/.test(value);
			},
			message: '请输入正确的密码格式'
		},
		
		checkFloat: {
			validator: function(value, param) {
				return /^[+|-]?([0-9]+\.[0-9]+)|[0-9]+$/.test(value);
			},
			message: '请输入合法数字'
		}
	});
})(jQuery);

  使用方法:引入拓展的js 这个就不说了。下面在使用中跟官方中的版本使用没什么区别。

<tr>
         <td>年龄:</td>
	 <td>
      <input class="easyui-textbox" data-options="required:true,validType:'checkNum'" name="age" id="age"></input>
    </td> </tr>

  

posted on 2016-06-20 10:44  左侧码工  阅读(465)  评论(0编辑  收藏  举报