jQuery EasyUI 表單插件 – Validatebox 驗(yàn)證框

jQuery EasyUI 表單插件 - Validatebox 驗(yàn)證框

jQuery EasyUI 插件

依賴

• tooltip

用法

從標(biāo)記創(chuàng)建驗(yàn)證框（validatebox）。

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

使用 javascript 創(chuàng)建驗(yàn)證框（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']">

驗(yàn)證規(guī)則

驗(yàn)證規(guī)則是通過使用 required 和 validType 屬性來定義的，這里是已經(jīng)實(shí)施的規(guī)則：

• email：匹配 email 正則表達(dá)式規(guī)則。
• url：匹配 URL 正則表達(dá)式規(guī)則。
• length[0,100]：允許從 x 到 y 個字符。
• remote['http://.../action.do','paramName']：發(fā)送 ajax 請求來驗(yàn)證值，成功時返回 'true' 。

要自定義驗(yàn)證規(guī)則，重寫 $.fn.validatebox.defaults.rules，來定義一個驗(yàn)證函數(shù)和無效的信息。例如，定義一個 minLength 驗(yàn)證類型：

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

現(xiàn)在您可以使用這個 minLength 驗(yàn)證類型來定義一個至少輸入5個字符的輸入框：

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

屬性

<input class="easyui-validatebox" data-options="required:true,validType:'url'">
<input class="easyui-validatebox" data-options=" 	required:true, 	validType:['email','length[0,20]'] ">

方法

jQuery EasyUI 插件