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>