`
kangsoft
  • 浏览: 70495 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

用My97扩展成的ExtJs日期时间插件

阅读更多

所有关联代码均在附件中下载

示例如下:

 

/**
 * 日期时间控件,可单独显示日期,或日期时间。格式可自己设置。和myDate97设置一样
 * @class Ext.form.DateTimeField
 * @extends Ext.form.TriggerField
 */
Ext.form.DateTimeField = Ext.extend(Ext.form.TriggerField, {
	/**
	 * @param {Array} date97配置列表
	 * @type 
	 */
	dateConfig:null,
	/**
	 * @param {Boolean} 是否显示时间,默认为不显示
	 */
	time:false,
	triggerClass : 'x-form-date-trigger',
	defaultAutoCreate : {tag : "input",type : "text",size : "10",autocomplete : "off"},
	initComponent : function() {
		Ext.form.DateField.superclass.initComponent.call(this);
		this.initDate97js();
		this.initDateConfig();
	},
	onTriggerClick : function(e) {// 点击查找按钮时
		if (this.disabled||this.readOnly) {
			return;
		}
		this.onFocus({});
		var bodyWidth = document.body.clientWidth;
		var xC = document.body.clientWidth - e.xy[0] - this.width;
		var yC = document.body.clientHeight - e.xy[1] - this.height; 
		var x=0;
		var y=0;
		if (xC > 0)
			x = e.xy[0];
		else
			x = document.body.clientWidth - this.width - 4;

		if (yC > 0)
			y = e.xy[1];
		else
			y= document.body.clientHeight - this.height - 4;
//		this.dateConfig['position']={left:e.xy[0],top:e.xy[1]};
		WdatePicker(this.dateConfig);
	},
	initDate97js:function(){
		var obj=this;
		if(!document.getElementById("$date97js")){
			 var  script  =  document.createElement("script");   
			  script.setAttribute("type",   "text/javascript");   
			  script.setAttribute("src",   MCLONIS+"/js/date97/WdatePicker.js");
			  script.setAttribute("id","$date97js");
			  try   
			  {   
				  document.getElementsByTagName("head")[0].appendChild(script);
				  script.onload = script.onreadystatechange = function() {
				 	  if (script.readyState && script.readyState != 'loaded' && script.readyState != 'complete') 
			            return; 
			         script.onreadystatechange = script.onload = null; 
 			         WdatePicker(1);
				 }
			  }catch(e){}
		}
	},
	initDateConfig:function()
	{
		if(!this.dateConfig)
			this.dateConfig=new Array();
		if(!this.dateConfig['el'])
			this.dateConfig['el']=this.id;
		if(this.time)
			this.addDateConfig("dateFmt",'yyyy-MM-dd HH:mm:ss');
		else
			if(!this.dateConfig["dateFmt"])
				this.dateConfig["dateFmt"]='yyyy-MM-dd';
		if(!this.dateConfig["skin"])
			this.dateConfig["skin"]='ext';
	},
	addDateConfig:function(name,value)
	{
		this.removeDateConfig(name);
		this.dateConfig[name]=value;
	},
	removeDateConfig:function(name){
		for (var i = 0; i < this.dateConfig.length; i++) {
			var temp = this.dateConfig[i];
			if (temp && temp.split(':')[0] == name) {
				this.dateConfig.pop(i);
				return;
			}
		}
	},
	setDateConfig:function(config)
	{
		this.dateConfig=config;
		this.initDateConfig();
	}
});

 


 


 

  • 大小: 11.9 KB
分享到:
评论
18 楼 tangyx 2012-04-06  
同求例子,EXT新手     支持Ext版本有限制吗  邮箱995770058@qq.com
17 楼 squalllove2012 2012-03-29  
楼主,非常感谢谢,麻烦你给我发一个能带上示例的,我的邮箱是squalllove@qq.com。
16 楼 wmj007 2012-02-22  
可以给我发一个吗,谢谢,我在IE8下没反应!wmj111@gmail.com
15 楼 hance1000000 2012-02-17  
楼主,求使用例子sharefun2068@qq.com
14 楼 Sartner 2011-10-31  
求新版
ass1982@sina.com
13 楼 心杀心 2011-10-16  
楼主发我一个,谢谢!javajax@126.com
12 楼 jhllf2006 2011-09-06  
楼主给个例子吧谢谢了!jhllf2006@126.com
11 楼 recoba2k1 2011-09-05  
楼主能发我一个吗?邮箱:recoba2k1@163.com,感谢。
10 楼 zxyqq070 2011-08-27  
zxyqq070@163.com 谢谢分享
9 楼 kangsoft 2011-08-24  
YuYongLi 写道
给的例子不是的,是跳转到一个网站的,做广告的

估计你的电脑中毒了。。。
8 楼 YuYongLi 2011-08-24  
给的例子不是的,是跳转到一个网站的,做广告的
7 楼 qscchao 2011-08-16  
谢谢,楼主给的例子,我下载新的版本后通过这样
var dateTime = new Ext.form.DateTimeField({
id:"d11"
});
创建对象,但是每当操作这个控件的时候火狐浏览器直接就崩溃了,IE下没反应,请问楼主这样创建对象正确吗?
6 楼 qscchao 2011-08-16  
kangsoft 写道
qscchao 写道
楼主能给个例子吗,具体怎么使用,我在EXT文件中创建了这个类的对象,但是只是显示日期,不能显示时间。
火狐中显示错误 D is null。

有新版本了,需要的话留下邮箱号

太感谢你了,请发到我的邮箱吧 qinshengchao@126.com
谢谢
5 楼 kangsoft 2011-08-16  
qscchao 写道
楼主能给个例子吗,具体怎么使用,我在EXT文件中创建了这个类的对象,但是只是显示日期,不能显示时间。
火狐中显示错误 D is null。

有新版本了,需要的话留下邮箱号
4 楼 qscchao 2011-08-05  
楼主能给个例子吗,具体怎么使用,我在EXT文件中创建了这个类的对象,但是只是显示日期,不能显示时间。
火狐中显示错误 D is null。
3 楼 fujingrun 2011-07-13  
挺不错
2 楼 xue811 2010-08-25  
冒似我放在项目里,firefox虽然会报错,但是可以用,ie7则不能用,还报$lang未定义!!!请问楼主有解决方法吗?
1 楼 xue811 2010-08-25  
想问一下,这个控件支持ie7吗?

相关推荐

    用My97扩展ExtJs日期时间插件 (EXT不支持时分秒,我们借助my97完成需求)

    用My97扩展ExtJs日期时间插件 (EXT不支持时分秒,我们借助my97完成需求)

    extjs My97使用 extjs时间 extjs日期使用

    extjs4.0结合My97DatePicker4.7版本使用 使用简单 方便 解决extjs中日期控件不能显示时间的问题 下载后将其放到extjs目录的examples下 直接运行date.html即可 extjs4.0版本 4.0以前的版本没有测试过 如果有4.0版本...

    简洁的EXTJS日期选择插件.rar

    一款简洁的外观基于EXTJS的日期选择插件,日历插件,在网页上选择日期使用的小插件,按照ext DatePicker素材及思想简化重新实现日历选择器,尚未实现:键盘导航,小时分钟选择,  1.Date api ,某日属于周几,某月...

    extjs 年月日期插件

    extjs中有时候查询需要通过日期(年月)查询。而这就是一个只显示年月的日期插件,很好用

    EXTJS日期扩展年月和年月日时分秒

    扩展日期选择时分秒--dateTimeField4.0.html (这个只在EXTJS4.0下显示可以) EXTJS4.1文件夹下面包括 1.只有年月选择--dateYM.html (这个在EXTJS4.0和4.1下显示都是可以的) 2.扩展日期选择时分秒--...

    EXTJS4.1计算器插件

    由于开发WEB需要一个WEB计算器插件,在网上找EXTJS4计算器插件没有一个,找extjs4.0计算器找到一个,但由于代码太多,在主界面上写太多代码,自我感觉以后看起来吃力,思路一下子不好摸到。因此写了这个插件,分享给...

    dreamweaver Extjs 扩展插件语法提示

    dreamweaver Extjs 扩展插件语法提示 在dreamweaver中可以显示Extjs语法提示,提升开发效率,用起来很方便 分.zxp和.mxp两种扩展 cc2015,cs6均可用。 扩展安装需要到用Adobe Extension Manager,请自行在网上百度,...

    extjs的spinner插件

    extjs的spinner插件源码,内容不多 能好好研究

    Extjs5 日期时间

    日期用Extjs自带的Ext.form.field.Date,时间用Ext.form.field.Number和Ext.form.Label进行组装。 样式显示为横向的日期、时间,非日期弹出框下方选择日期。 调用代码:Ext.create('erp.ux.form.field.DateTimer', {...

    Extjs_htmleditor插件

    Extjs_htmleditor插件

    ExtJS-4.2.6扩展ux插件89个

    Ext JS 4.2.6.1811 Release Date: October 5, 2016 Version Number: 4.2.6.1811 ext-examples-ux 89

    ExtJS日期时间选择控件示例

    ExtJS日期时间控件。详细信息参照我的博文: http://blog.csdn.net/lvye1221/article/details/10225941 这是我在 apache 目录下部署了测试示例。将附件中的测试用例,按照以下方式部署好,即可成功访问: apache ...

    extjs插件开发教程

    extjs插件开发教程

    extjs 日期时间

    extjs2.0实现的日期时间选择控件,直接放在extjs的examples文件夹下运行。

    extjs 代码提示插件

    extjs 代码提示插件(vs2008)

    Extjs4.1可用的日期时间选择控件

    Extjs4.1可使用的日期时间选择控件,其中有一些不合理之处请各位多提宝贵意见。

    extjs-ux, EXT JS 4的一些插件和扩展.zip

    extjs-ux, EXT JS 4的一些插件和扩展 插件和 EXT JS 4扩展 Ext.ux. aceeditor.Panel 演示( 简单): 链接演示( 流 语法): 链接演示:链接论坛:链接 Ext.ux. grid.feature.Tileview 演示:链接

    extjs日期+时间控件

    http://www.uspcat.com/forum.php?mod=viewthread&tid=5293 帖子上的日期时间控件有显示的问题,现在修改一下发出来, 该控件基于4.1版本

    Extjs5 日期时间公共组件

    日期用Extjs自带的Ext.form.field.Date,时间用Ext.form.field.Number和Ext.form.Label进行组装。 样式为横向的日期、时间,非日期弹出框下方选择时间。 注意事项:1、只有日期、年、月、日全部选择后,才能从name中...

    Extjs相关插件

    Extjs相关插件

Global site tag (gtag.js) - Google Analytics