extjs5 form实现两个日期控件限制，第一个的日期小于第二个日期

最新推荐文章于 2022-09-26 14:09:47 发布

weixin_30621919

最新推荐文章于 2022-09-26 14:09:47 发布

阅读量193

点赞数

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/crybreath/p/5363852.html

本文介绍如何在ExtJS中实现两个日期选择字段的联动效果，确保结束日期不会小于开始日期。通过监听开始日期的变化并设置为结束日期的最小值，实现日期范围的有效控制。

For example：

 1 var searchForm = Ext.create('Ext.form.Panel',{
 2 
 3 　　region:'north',
 4 
 5 　　formName:'searchForm',
 6 
 7 　　id:'searchForm',
 8 
 9 　　layout:'column',
10 
11 　　items:[
12 
13 　　　　　　DD.FM("beginDate",{id:'beginDate',fieldLabel:'起始日期',labelAlign:'right',xtype:'datefield',allowBlank:'true'}),
14 
15 　　　　　　DD.FM("endDate",{id:'endDate',fieldLabel:'结束日期',labelAlign:'right',xtype:'datefield',allowBlank:'true'})
16
17 　　　　　　]
18 //用id来唯一标识
19 });
20 
21 //添加change事件，设置已选的第一个日期是第二个日期可选的最小值
22 
23 Ext.getCmp('beginDate').on({
24 
25 　　'change':function(obj,event,eOpts){
26 
27 　　　　Ext.getCmp('endDate').setMinValue(Ext.getCmp('beginDate').getValue()
28 
29 }
30 
31 });
32 
33