Extjs中Ext.form.VTypes日期大小比较的实例

最新推荐文章于 2021-01-13 23:25:36 发布

原创最新推荐文章于 2021-01-13 23:25:36 发布 · 3.6k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#extjs #扩展 #实例 #javaScript

Extjs 专栏收录该内容

4 篇文章

订阅专栏

本文介绍了一种在ExtJS框架中扩展日期字段验证的方法。通过重写Ext.form.VTypes类来实现日期范围的有效验证，确保结束日期不会小于或等于开始日期。文章提供了具体的配置示例。

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

Ext.apply(Ext.form.VTypes, {
	sField : function(val, field) {
		var f = field.getValue();
		var sf = field.tScope[field.smallerField].getValue();
		if (!Ext.isEmpty(f) && !Ext.isEmpty(sf) && Number(sf) >Number(f)) {
			return false;
		} else {
			return true;
		}
	},
	sFieldText : '结束日期不能小于开始日期',
	smallerEqField : function(val, field){
		var f = field.getValue();
		var sf = field.tScope[field.smallerEqField].getValue();
		if (!Ext.isEmpty(f) && !Ext.isEmpty(sf) && Number(sf) >= Number(f)) {
			return false;
		} else {
			return true;
		}
	},
	smallerEqFieldText : '结束日期不能小于或等于开始日期'
});

以上是这个类的扩展，使用的方式如下：

其中有一篇帖子讲解如何重写VTypes，点击Ext.form.VTypes

{
				xtype : "container",
				layout : "form",
				colspan : 1,
				items : {
					xtype : 'sysDateField',
					fieldLabel : '开始日期',
					hiddenName : 'bdate',
					value : App.defaultValue.date,//设置的默认值，是系统当前的时间
					allowBlank : false
				}
			}, {
				xtype : "container",
				layout : "form",
				colspan : 1,
				items : {
					xtype : 'sysDateField', //重写了datefield，无关紧要
					fieldLabel : '结束日期',
					hiddenName : 'edate',
					vtype : 'sField',
					smallerField : 'bdate',
					tScope : this,
					value : '20991231', //日期格式，处理时可以作为整形，方便处理。
					allowBlank : false
				}
			}