开发指南专题十:JEECG微云快速开发平台--表单校验组件ValidForm
开发指南专题十:JEECG微云快速开发平台--表单校验组件ValidForm
10.4Validform对象[方法支持链式调用]
如示例 var demo=$(".formsub").Validform(),那么demo对象会有以下属性和方法可以调用:
tipmsg【object】
如:demo.tipmsg.s="error! no messageinputed.";
通过该对象可以修改除 tit 以外的其他提示文字,这样可以实现同一个页面的不同表单使用不同的提示文字。
具体可修改的提示文字
$.Tipmsg={//默认提示文字; def:"请填写正确信息!", |
要修改tit(弹出框的标题文字)的话,可以这样:$.Tipmsg.tit="MessageBox",则弹出框的标题文字会换成"Message Box"。
注:5.3+
$.Tipmsg.w里,形如"*6-16"的提示文字,里面的数字是会被替换的。如绑定datatype="*2-18",那它默认的出错信息就会是"请填写2到18位任意字符!",可以通过$.Tipmsg.w这个对象修改和扩展默认错误信息,如果你已经设置了"zh2-4"的提示信息是"2-4位中文",那么"zh2-8"出错的信息就自动会是:"2-8位中文"。对于自定义的datatype,在扩展默认信息时,注意错误信息的名字要跟datatype名字一样,如上面示例是:$.Tipmsg.w["zh2-4"]="2-4位中文"。对于多页面或一个页面多表单有相同datatype来说,在$.Tipmsg.w中扩展默认提示信息是个很好的选择。目前只能通过$.Tipmsg.w扩展,还不能使用Validform对象的tipmsg属性来扩展。
$.Tipmsg.s_auto是用来指定在没有绑定nullmsg,且指定了标签Validform_label时的默认提示信息。"{0}"是会被找到的Validform_label里的文字替换掉的,"{填写}"里的文字在绑定了"recheck"属性的表单元素上检测时是会不显示的。
具体示例请参见demo页。
dataType【object】
获取内置的一些正则:
{ |
addRule(rule)【返回值:Validform】
可以通过Validform对象的这个方法来给表单元素绑定验证规则,绑定验证类型中列出的附加属性都可以通过这个方法绑定。
demo.addRule([ |
其中ele是指定要绑定规则的对象,会在Validform对象下查找这些对象。
eq(n)【返回值:Validform】
获取Validform对象的第n个元素。
如你页面上有多个form的class都是formsub,执行上面的验证绑定,得到的demo对象就可以操作所有这些表单,如果你要对其中某个表单执行某些操作,那么就可以使用这个方法。
如demo.eq(0).resetForm(),重置第一个表单。
ajaxPost(flag,sync,url)【返回值:Validform】
以ajax方式提交表单。flag为true时,跳过验证直接提交,sync为true时将以同步的方式进行ajax提交。
参数url是5.3版新增,传入了url地址时,表单会提交到这个地址
如demo.ajaxPost(true),不做验证直接ajax提交表单。
abort()【返回值:Validform】
终止ajax的提交。
如执行上面的ajaxPost()之后,发现某些项填写不对,想取消表单提交,那么就可以执行这个操作:demo.abort()
submitForm(flag,url)【返回值:Validform】
以初始化时传入参数的设置方式提交表单,flag为true时,跳过验证直接提交。
参数url是5.3版新增,传入了url地址时,表单会提交到这个地址
如demo.submitForm(true),不做验证直接提交表单。
resetForm()【返回值:Validform】
重置表单。
如demo.resetForm(),重置表单到初始状态。
resetStatus()【返回值:Validform】
重置表单的提交状态。传入了postonce参数的话,表单成功提交后状态会设置为"posted",重置提交状态可以让表单继续可以提交。
如demo.resetStatus()
getStatus()【返回值:String】
获取表单的提交状态,normal:未提交,posting:正在提交,posted:已成功提交过。
如demo.getStatus()
setStatus(status)【返回值:Validform】
设置表单的提交状态,可以设置normal,posting,posted三种状态,不传参则设置状态为posting,这个状态表单可以验证,但不能提交。
如demo.setStatus("posted")
ignore(selector)【返回值:Validform】
忽略对所选择对象的验证,不传入selector则忽略所有表单元素。
如demo.ignore("select,textarea,#name"),忽略Validform对象下所有select,textarea及一个id为"name"元素的验证。
unignore(selector)【返回值:Validform】
将ignore方法所忽略验证的对象重新获取验证效果,不传入selector则恢复验证所有表单元素。
如demo.unignore("select,textarea,#name"),恢复Validform对象下所有select,textarea及一个id为"name"元素的验证。
check(bool,selector)【返回值:Boolean】
bool为true时则只验证不显示提示信息
对指定对象进行验证(默认验证当前整个表单),通过返回true,否则返回false(绑定实时验证的对象,格式符合要求时返回true,而不会等ajax的返回结果)
如demo.check(),验证当前整个表单,且只验证但不显示对错信息。
config(setup) 5.3+ 【返回值:Validform】
setup参数是一个对象。
如:
demo.config({ |
可用参数:
url:指定表单的提交路径,这里指定的路径会覆盖表单action属性所指定的路径
ajaxpost:表单以ajax提交时,可以在这里配置ajax的参数
ajaxurl:配置实时验证ajax的参数
(1) 执行config可以动态设置、添加参数,如:
demo.config({ |
那么在点击save按钮后,demo所对应的表单的配置为:
config={ |
(2) 参数url的优先级:form表单的action所指定的提交地址会被config.url覆盖,config.url会被config.ajaxpost.url覆盖,config.ajaxpost.url会被Validform对象的方法submitForm(flag,url)和ajaxPost(flag,sync,url)里的url覆盖。
如果表单里没有指定action提交地址,那么就会提交到config.url设定的地址。
(3) 考虑到整个验证框架的逻辑,传入dataType参数不会起作用,不会被覆盖,ajax必须返回含有status值的json数据。
另外注意的是:传入的success和error方法里,能多获取到一个参数,如:
demo.config={ |
10.5调用外部插件
文件上传 - swfupload
选择文件后立即上传
表单验证通过后上传文件
密码强度检测 - passwordStrength
密码强度提示与验证提示同时显示
在符合验证要求时才有密码强度提示
日期控件- datePicker
默认效果
选择日期后执行回调函数
表单美化- jqtransform
默认对所有元素美化
美化指定的表单元素
10.6Validform的公用对象
$.Datatype
可以通过$.Datatype对象来扩展datatype类型。
如$.Datatype.zh=/^[\u4E00-\u9FA5\uf900-\ufa2d]{1,}$/
$.Tipmsg
可以通过$.Tipmsg对象来修改默认提示文字。具体可修改的提示文字请查看Validform对象的tipmsg属性。
如果Validform对象的tipmsg属性没有找到相关的提示信息,那么就会到$.Tipmsg中查找对应提示文字。
如$.Tipmsg.tit="msg box"; //设置默认弹出框的标题文字。
$.Showmsg(msg)
调用Validform自定义的弹出框。
参数msg是要显示的提示文字。
如$.Showmsg("这是提示文字");//如果不传入信息则不会有弹出框出现,像$.Showmsg()这样是不会弹出提示框的。
$.Hidemsg()
关闭Validform自定义的弹出框。
如$.Hidemsg()
开发指南专题十:JEECG微云快速开发平台--表单校验组件ValidForm相关推荐
- 开发指南专题七:JEECG微云快速开发平台查询HQL过滤器
开发指南专题七:JEECG微云快速开发平台 HQL过滤器 1. 查询HQL过滤器 1.1. 数据过滤现状分析 项目开发的查询页面都会有很多查询条件,开发追加查询条件的工作繁琐又很浪费时间. 这块工作量 ...
- 开发指南专题四 JEECG微云快速开发平台--JEECG开发环境搭建
分享一下我老师大神的人工智能教程!零基础,通俗易懂!http://blog.csdn.net/jiangjunshow 也欢迎大家转载本篇文章.分享知识,造福人民,实现我们中华民族伟大复兴! 开发指南 ...
- 开发指南专题一: JEECG微云快速开发平台前言
JEECG微云快速开发平台-前言 1. 前言 1.1. 技术背景 随着WEB UI 框架(EasyUI/Jquery UI/Ext/DWZ)等的逐渐成熟,系统界面逐渐实现统一化,代码生成器也可以生成统 ...
- 开发指南专题九:JEECG微云快速开发平台-表单校验组件ValidForm
开发指南专题九:JEECG微云快速开发平台表单校验组件ValidForm 10.表单校验组件ValidForm 10.1使用入门 1.引入css 请查看下载文件中的style.css,把里面Valid ...
- 开发指南专题十六:JEECG微云快速开发平台Excel导出
开发指南专题十六:JEECG微云快速开发平台Excel导出 14.3. Excel导出 导出工具类ExcelExportUtil 提供两个函数 //创建多个Sheet public static H ...
- 开发指南专题十四:JEECG微云快速开发平台MiniDao 介绍
开发指南专题十四:JEECG微云快速开发平台MiniDao 介绍 13.MiniDao 介绍 13.1. MiniDao简介及特征 MiniDao是Jeecg自己的持久化解决方案,具备了Hibern ...
- 开发指南专题十五 JEECG微云快速开发平台EXCEL导入导出
分享一下我老师大神的人工智能教程!零基础,通俗易懂!http://blog.csdn.net/jiangjunshow 也欢迎大家转载本篇文章.分享知识,造福人民,实现我们中华民族伟大复兴! 开 ...
- 专题开发十二:JEECG微云快速开发平台-基础用户权限
专题开发十二:JEECG微云快速开发平台-基础用户权限 11.3.4自定义按钮权限 Jeecg中,目前按钮权限设置,是通过对平台自己封装的按钮标签(<t:dgFunOpt等)进行设置.而在开 ...
- 开发指南专题十一:JEECG微云快速开发平台--基础用户权限
开发指南专题十一:JEECG微云快速开发平台--基础用户权限 11.1. 权限设计 基本概念 权限管理模块涉及到的实体有:用户.角色和系统资源(包括系统菜单.页面按钮等).用户可以拥有多个 ...
最新文章
- d3.js--04(enter和exit)
- ISA系列之ISA Server 2004 中的新增功能--利用多个网络
- 用户故事地图对应到Epic及其缺点
- C++面向对象设计原则详解
- WebBrowser内核指定
- 新!详细!win10下MySQL数据库干净卸载安装与配置
- AtomicReference 原子引用
- How to fix the bug “Expected required, optional, or repeated.”?
- figma下载_如何在Figma中创建逼真的3D对象
- Practical Tactics for Social Intercourse One
- 免匙SSH登录失败问题(非常规)
- 概述无线传感网的MAC协议
- 魔王语言解释器C语言,[数据结构]魔王语言解释c语言实现
- 少儿编程启蒙课程9:善用变量 拥抱变化
- 邹宇阳:仅成立8个月的个人网站如何月收入几十万美金
- Linux 【网络】C10K 和 C1000K 回顾
- pandas中Series的apply函数
- element ui 基本操作
- 基于JAVA的城市公交查询系统毕业论文(含源文件)
- 一个3D视频播放器的演示APK
热门文章
- mysql统计各部门人数_2021各省份电网报名人数统计!会不会比考研还难?有些省份人数还就多的离谱了。。。...
- android opengl es 粒子效果实例代码
- (软件工程复习核心重点)第九章软件项目管理
- (王道408考研数据结构)第五章树-第三节1:二叉树遍历(先序、中序和后序)
- IPv4和IPv6有什么异同?
- mysql除法运算保留小数的用法
- Module database cache not built yet, using slow search
- Linux C线程同步的三种方法
- matlab实现一/多元线性回归
- 第三章:选择结构(一)