项目中需要开始时间和结束时间的验证。因为需求涉及到两个时间,所以要有验证开始时间不能大于结束时间。之前对extjs4了解不够深入,所以这个验证是放在后台来完成,然后在前台弹出一个alert来提示用户“开始时间不能大于结束时间”。这样做依然用户体验不好,不能输入完后马上就提示用户,而且还会发送没必要的请求增加服务器负担。多个字段的验证就能很好的解决这个问题。但是实现也要比单个字段的验证要复杂些,除了要自定义验证外,还要自定义属性用以配置两个互相关联的日期字段:
Ext.apply(Ext.form.field.VTypes, { // 自己拓展比较时间的vtype dateRange : function(val, field) { var beginDate = null, // 开始时间 beginDateCmp = null, // 开始日期组件 endDate = null, // 结束日期 endDateCmp = null, // 结束日期组件 validStatus = true;// 验证结果 if (field.dateRange) { // 获取开始时间 if (!Ext.isEmpty(field.dateRange.begin)) { beginDateCmp = Ext.getCmp(field.dateRange.begin); beginDate = beginDateCmp.getValue(); } // 获取结束时间 if (!Ext.isEmpty(field.dateRange.end)) { endDateCmp = Ext.getCmp(field.dateRange.end); endDate = endDateCmp.getValue(); } } // 如果开始日期或者结束日期有一个为空则验证通过 if (!Ext.isEmpty(beginDate) && !Ext.isEmpty(endDate)) { validStatus = beginDate <= endDate; } return validStatus; }, dateRangeText : '开始时间不能大于结束时间!' })
在控件中配置也有点不一样,除了要配置vtype属性,还要配置自定义的属性:
dateRange : { begin:'createSetAdWin-startT', end : 'createSetAdWin-endT' }
这样就行了
相关推荐
extjs验证 extjs验证 extjs验证 extjs验证extjs验证 extjs验证 extjs验证 extjs验证
extjs 常用vtype 代码 Ext.VTyps常用vtype大全!
Extjs表单VTYPE扩展,方便验证!
1.ExtJS自定义组件,图片按钮为例. 2.此图片按钮背景完全为图片,没有边框,需要使用者提供2张图片,一张初始化用,一张点击后用,可在'imgPaths:'属性里填写,格式为'01.jpg~02.jpg' 3.解压后请将所有附件放置您extjs...
Extjs4.2自定义ComboTree
ExtJs自定义消息框,自带的消息框,可以下载来了解一下。
之前项目使用的一个深蓝色主题,继承自extjs4原生classic主题。 先引入ext-ux-all.css,再引入fixed.css
extjs自定义控件extjs自定义控件extjs自定义控件extjs自定义控件extjs自定义控件extjs自定义控件extjs自定义控件
Extjs验证 Extjs验证Extjs验证 Extjs验证Extjs验证 Extjs验证Extjs验证 Extjs验证
自定义高级查询Extjs
ExtJS 6.2.0包含文本及时间选择框的自定义查询控件的解决方案,下拉式控件
xtype : 'jxcombo' //配置项 jxValueField:要获取值得字段名称,默认null //公共方法 getJXValue():返回自定义字段的值,如果没有自定义字段,则等价Ext.form.Combo类的getValue()方法
在 ExtJS3.3基础上开发的. 低一点的版本应该也能用. 没有去测试. 参考: Ext.PagingToolbar.js 因为我开发测试完这个分页工具后, 电脑上显示刚好是15:00, 所以取名: PM3PagingToolbar 如有BUG还请各位提出或留言. ...
自定义下拉树,你懂的,内附图和前后台源代码
extjs中强大的用户自定义换肤功能,用户可以选择自己喜欢的颜色来进行系统的风格设置
extjs4扁平化设计,extjs4自定义主题,效果还不错,比较适合快捷学习和修改页面使用。
EXTJS主题自定义中文版,根据官方的英文DOS翻译过来的,谢谢支持
自定义树结构实现以及动态表头实现,整个程序是完整的,包括后台数据读取,数据赋值,树结构的类定义,前后端函数映射实现等,前端运用Extjs搭建页面
EXTJS4自学手册——EXT数据结构组件(Model数据验证,数据交互) EXTJS4自学手册——EXT数据结构组件 EXTJS4自学手册——EXT数据结构组件(proxy代理类之客户端代理) EXTJS4自学手册——EXT数据结构组件(proxy...
就是extjs4里面,想给grid里面一格中,文字后面加个小图标。 因为俺们项目就只是文字+图标,所以俺就没有复写Actioncolumn,而是从Column下面继承了一下。。 包含自定义插件源码、效果图等等。