EASYUI 使用自定义的校验类型来联动校验表单

本文介绍如何在EasyUI中扩展自定义校验规则,实现根据输入框A的值联动校验输入框B的值是否相同。通过自定义规则并配置HTML元素,确保表单验证的灵活性。注意,自定义规则需单独配置属性,且处理Combobox时需采用特定方式获取值。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

EasyUI的校验,一般使用validatebox来进行处理,除了一些已经给定的校验规则,有时候需要按照自己的特殊需求进行自定义校验规则,校验展示是按照原本的样式来展示;扩展性非常强。

例如,下面两个输入框,要根据输入框A的值对输入框B的值进行校验是否输入相同:

1)自定义规则,扩展EasyUI的校验规则:

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

2)配置HTML元素:

<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']">

注意点是,自定义的不能再data-options这个元素中使用了,只能分别配置属性


3) 还要注意一点,第1)步中,如果传入的param的class是一个combobox,这样的话通用的jQuery获取值方式就无法成功了,只能使用:

return value == $(param[0]).combobox('getValue');

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值