easyUI validatebox

@author YHC

首先说一下,如果你看了你觉得写的不好,你踩了,如果要是你能告诉我原因那就更好了!

覆盖默认值$.fn.validatebox.defaults.

validatebox是设计验证表单输入字段的,如果用户输入不合法数据,它将改变它的背景颜色,显示一个警告的icon和一个提示信息,validatebox可以整个form

插件,它将阻止不合法的字段从form提交

使用

从标记创建validatebox

<input id="vv" class="easyui-validatebox" data-options="required:true,validType:'email'" />  

使用javascript创建validatebox

<input id="vv" />  

$('#vv').validatebox({  
    required: true,  
    validType: 'email'  
});  

验证密码和重新输入密码一致

// extend the 'equals' rule  
$.extend($.fn.validatebox.defaults.rules, {  
    equals: {  
        validator: function(value,param){  
            return value == $(param[0]).val();  
        },  
        message: 'Field do not match.'  
    }  
}); 

<input id="pwd" name="pwd" type="password" class="easyui-validatebox" data-options="required:true" />  
<input id="rpwd" name="rpwd" type="password" class="easyui-validatebox"   
    required="required" validType="equals['#pwd']" />  

验证规则

验证规则是定义在required和validType属性上,以下的规则已经实现了

• email: 匹配email正则规则 .
• url: 匹配URL正则规则 .
• length[0,100]: 允许在x到x之间的字符数.
• remote['http://.../action.do','paramName']: 发送ajax请求验证值,当成功之后返回'true'.

自定义验证规则,重写  $.fn.validatebox.defaults.rules定义一个validator(验证器)函数和一个invalid(不合法)信息,例如:定义一个minLength(最小长度)验证类型.

$.extend($.fn.validatebox.defaults.rules, {  
    minLength: {  
        validator: function(value, param){  
            return value.length >= param[0];  
        },  
        message: 'Please enter at least {0} characters.'  
    }  
}); 

现在你可以使用最小长度( minLength)验证类型,定义到一个input输入框,应该至少输入5个字符

<input class="easyui-validatebox" data-options="validType:'minLength[5]'">  

属性

Name	Type	Description	Default
required	boolean	定义该字段是否应该输入.	false
validType	string	定义这个字段的验证类型, 例如 email, url, 等等.	null
missingMessage	string	显示的提示文本,当输入框为空的时候.	This field is required.
invalidMessage	string	显示提示显示,当文本框内容是不合法的时候.	null

方法

Name	Parameter	Description
destroy	none	移除和销毁组件.
validate	none	做验证,决定文本框内容是否合法.
isValid	none	调用validate方法,返回验证结果,true或者false.

    以上如果有问题,请指出,thanks!