jQuery EasyUI-validatebox验证框、实现自定义验证
来源:互联网 发布:做谱子的软件 编辑:程序博客网 时间:2024/04/30 23:39
效果图:
- 首先我们要先重写$.fn.validatebox.defaults.rules定义的验证器和错误信息
$.extend($.fn.validatebox.defaults.rules, { //在这里写重写的验证其及方法和错误信息});
- 验证长度示例
- 验证比较俩个值是否相等,如二次输入密码验证
- 表单相关 代码
<form id="ff" class="easyui-form" method="post" data-options="novalidate:true" action="/login"> <table cellpadding="5"> <tr> <td id="name">用户名:</td> <td><input class="easyui-textbox" id="userName" type="text" name="userName" data-options="iconCls:'icon-man',required:true,validType:'length[4,10]',missingMessage:'请输入用户名'"/></td> </tr> <tr> <td>密码:</td> <td><input class="easyui-textbox" id="passWord" type="password" name="passWord" data-options="iconCls:'icon-lock',required:true,validType:'length[6,12]',missingMessage:'请输入密码'"/></td> </tr> <tr> <td>重复密码:</td> <td><input class="easyui-textbox" id="rePassWord" type="password" name="rePassWord" data-options="iconCls:'icon-lock',required:true,validType:'equalTo[\'#passWord\']', invalidMessage:'再次输入的密码不一致', missingMessage:'请再输入一次密码'"/></td> </tr> </table> </form>
missingMessage 表示验证为空的情况提示的信息
invalidMessage 表示验证失败时提示的信息
- 触发验证
先来看看easyUI为我们生成的源码
可以看出我们定义的文本框ID和生成后的文本框不是同一个- -。。所以如果使用JS或者jQuery方式添加事件就比较麻烦,这里我们使用easyUI提供的方式添加事件。
以用户名输入框为例
//userName类型是textbox $("#userName").textbox({ //onChange事件-其他支持事件查看API onChange:function () { //调用当前对象组件的'enableValidation'方法开启验证 $(this).textbox('enableValidation'); } });
如果用提交form来触发表单下组件的验证
$('表单选择器').form('enableValidation');
2 1
- jQuery EasyUI-validatebox验证框、实现自定义验证
- jquery-easyui-validatebox【自定义验证】
- Jquery EasyUI --ValidateBox验证框
- EasyUI validatebox 自定义验证
- jQuery-EasyUI validatebox+正则表达式实现验证
- JQUERY EASYUI 验证框(VALIDATEBOX)用法
- JQUERY EASYUI 验证框(VALIDATEBOX)用法
- jQuery EasyUI validatebox 验证类型
- jQuery EasyUI扩展:validatebox实现多重规则验证
- EasyUI之验证框validatebox
- jQuery EasyUI API 中文文档 - ValidateBox验证框
- Easyui validatebox修改 以及自定义验证规则
- Easyui的validatebox验证方法自定义扩展
- jQuery easyui validatebox 添加验证类型
- jQuery easyui validatebox 添加验证类型2
- Jquery Easyui验证组件ValidateBox使用详解
- easyui validatebox 验证集合,自定义easyui验证规则
- easyui validatebox 验证集合,自定义easyui验证规则
- PAT L2-011.玩转二叉树(数据结构,二叉链表)
- (4.6.13)StrictMode严苛模式协助程序开发查错
- 基于Linux的网络编程
- 如何定位和解决Andorid的内存溢出问题(大总结)
- 查找链表的中点if(fast!= NULL && fast->next != NULL) { //要用并运算,1->2中slow不能跳,所以要并运算fast->next != NULL
- jQuery EasyUI-validatebox验证框、实现自定义验证
- 面试题15:链表中倒数第k个节点
- Criteria-遍历 查询唯一对象
- vmware反复触发numlock问题
- keepalived理论工作原理
- 安装zip格式mysql
- SICP 习题1.40 cubic
- 仪仗队 [Bzoj 2190,SDOI2008]
- Centos 6.4 python 2.6 升级到 2.7