`
czwlucky
  • 浏览: 49940 次
  • 性别: Icon_minigender_1
  • 来自: 河南郑州
社区版块
存档分类
最新评论

使用DateField做为ItemEditor

    博客分类:
  • Flex
阅读更多

使用DateField做为ItemRenderer或ItemEditor时,如果输入源是String类型时,使用原始的DateField不能达到目的.所以需要扩展一下:

<?xml version="1.0" encoding="utf-8"?>
<mx:DateField xmlns:mx="http://www.adobe.com/2006/mxml"
	editable="true" open="openHandler()" close="closeHandler()">
    <mx:Script>
       <![CDATA[
       	import mx.controls.listClasses.ListData;
       	import mx.controls.Alert;
       	import mx.controls.dataGridClasses.DataGridListData;
       	
       	private var _selectedDate:Date = null;
       	
       	private var _textFormatString:String = "YYYYMMDD";
       	
       	public function set textFormatString(value:String):void 
       	{
       		if(value) _textFormatString = value;
       	}
       	
       	public function get textFormatString():String 
       	{
       		return _textFormatString;
       	}
       	
       	override public function set formatString(value:String):void 
       	{
       		if(value == null) {
       			super.formatString = "YYYY.MM.DD";
       		} else {
       			super.formatString = value;
       		}
       	}
       	
       	override public function get formatString():String 
       	{
       		return super.formatString || "YYYY.MM.DD";
       	}
       	
	    override public function set data(value:Object):void
	    {
	    	var newDate:Date;
	    	
            if (value is String)
            {
                newDate = DateField.stringToDate(value as String, textFormatString);
            }
            else if (value is Date)
            {
                newDate = value as Date;
            } 
            else if(value != null) 
            {
            	var v:Object;
                if (listData && listData is DataGridListData)
                {
                	v = value[DataGridListData(listData).dataField];
		            newDate = v is Date ? v as Date : DateField.stringToDate(v as String, textFormatString);
                }
		        else if (listData is ListData && ListData(listData).labelField in value)
		            v = value[ListData(listData).labelField];
		            newDate = v is Date ? v as Date : DateField.stringToDate(v as String, textFormatString);
            }
	            
	        this.selectedDate = newDate;
	    }
	    
	    override public function get text():String 
	    {
	    	return DateField.dateToString(this.selectedDate, textFormatString);
	    }
	    
	    override public function set text(value:String):void
	    {
	    	super.text = value; Alert.show(value);
	    }
	    
	    override  public function get selectedDate():Date
	    {
	        return _selectedDate;
	    }
	    
	    override public function set selectedDate(value:Date):void
	    {
	    	super.selectedDate = value;
	    	this._selectedDate = value;
	    }
	    
	    private function openHandler():void {
	    	super.open();
	    	super.selectedDate = this.selectedDate;
	    }
	    
	    private function closeHandler():void {
	    	super.close();
	    	this.selectedDate = super.selectedDate;
	    }
	    
       ]]>
    </mx:Script>
</mx:DateField>

 

分享到:
评论

相关推荐

    自定义DateField

    因此,自定义DateField控件的创建变得尤为重要。本文将深入探讨如何在Flex中自定义DateField,以实现更丰富的功能,例如添加时间选择,并提供源码参考。 自定义DateField控件通常涉及以下几个关键步骤: 1. **扩展...

    flex DateField 时分秒 选择

    6. 示例或测试代码:压缩包可能还包含一个简单的示例应用,用来展示如何使用这个自定义DateField控件,以及如何在实际项目中集成它。 对于Flex 4.0版本,这意味着该代码利用了Spark组件库,该库提供了更丰富的组件...

    Flex自定义DateField选择时分秒 修复版

    默认显示为中文,这意味着这个组件还考虑到了本地化需求,适应了中国用户的使用习惯。 在Flex中,实现这一功能可能涉及以下步骤: 1. 创建一个新的MXML组件,继承自mx.controls.DateField。 2. 在新组件中覆写默认...

    Flex自定义DateField选择时分秒

    3. **格式化显示**:使用`formatString`属性来定义显示的日期和时间格式。例如,如果希望显示"YYYY-MM-DD HH:MM:SS"格式,可以设置`formatString="yyyy-MM-dd HH:mm:ss"`。 4. **事件监听**:为时间选择组件添加...

    Ext DateField控件 - 只选择年月

    1. **类定义**:创建一个新的DateField子类,可能命名为`MonthPicker`,继承自Ext.form.field.DateField。 2. **配置项**:定义新的配置选项,如`allowOnlyMonthYear`,用于开启只选择年月模式。 3. **模板修改**:...

    Ext扩展dateField时间控件,可以选择年月日、年月、年、月

    总的来说,`Ext`框架中的`dateField`扩展为开发者提供了强大的工具,使他们能够创建适应各种场景的时间选择控件,不仅满足基本的日期输入需求,还能提供更加精细化和定制化的用户体验。通过深入学习和理解`...

    extjs DateField完全操作

    考虑到extjs DateField的关键配置和主要操作

    Ext dateField扩展 可单独选择年月,年,月.可清空

    1. **需求分析**:解释为什么需要这种可单独选择年、月、日的dateField,以及清空功能的重要性。 2. **实现原理**:介绍如何利用Ext JS的组件模型和事件机制,修改dateField的默认行为,添加新的选择模式和清空按钮...

    extjs中 google 不兼容 datefield 控件

    在使用ExtJS进行Web开发时,部分开发者可能会遇到这样一个问题:当使用DateField控件时,在Google Chrome浏览器中出现样式错乱或其他显示异常的情况。这主要是因为Chrome浏览器的一些特性和ExtJS中的默认设置之间...

    Flex中DateField实现时分秒选择并添加确定按钮 DateChooser

    最近刚好用到DateField组件,却无奈的发现只能选择年月日,不支持时分秒,在晚上找了好多,有的勉强可以用,但是很不完善.对从网上拿到一份代码进行了改善,具体从哪里拿的也忘了,请原作者勿怪. 改善之后的功能: 1.可以...

    Flex4_DateChooser_DateField

    DateChooser通常用于为用户提供一个日历选择器,而DateField则是一个文本输入框,显示所选日期并允许用户通过键盘或上下文菜单编辑日期。 首先,让我们深入理解`DateChooser`组件。DateChooser控件在Flex4中提供了...

    extjs中dateField日期精确到时分秒的扩展控件

    我们可以为这个组件设置监听事件,当用户选择完时间后,更新DateField的值。 5. **事件监听和处理**: 添加必要的事件监听器,例如监听日期和时间选择的改变,然后更新模型和存储。EXTJS提供了丰富的事件系统,如`...

    Flex 带时间的DateField的

    当我们需要在用户界面中添加带有时间选择功能的日期输入控件时,`Flex 带时间的DateField`就显得尤为重要。这个特殊的DateField不仅能够显示日期,还能让用户选择具体的时间,提升了用户体验。 首先,我们要理解...

    Ext DateField控件 - 只选择年月插件

    在使用这个插件时,首先需要引入相关的CSS和JavaScript文件,这些文件通常位于压缩包中的"Ext DateField控件 - 年月选择插件"目录下。接着,你需要在DateField配置中启用插件,指定显示的格式,如'Y-m',这将确保...

    DateField与DataGrid的交互

    在JavaFX或ExtJS等框架中,我们可以使用内置的日期函数来完成这个计算,例如Java中的 `java.time.Duration` 或JavaScript的 `Date` 对象。 接下来,我们需要将计算得到的时间差整合进数据源。这个数据源可能是数组...

    extjs4.2 日期控件 datefield 拓展加上选择时分秒功能

    extjs4.2 日期控件 datefield 拓展加上选择时分秒功能。 在ExtJs4.2表单控件里分别有个时间控件(datafield)和时间控件(timefield),但是官方提供的控件不能将日期和时分秒整合到一起,我从网上搜集整理了一个可用...

    ExtJs 带清空功能的日期组件

    在表单中,我们可以像使用普通DateField一样使用我们的ClearableDateField。 ```javascript Ext.create('Ext.form.Panel', { items: [{ xtype: 'clearabledatefield', fieldLabel: '日期' }], renderTo: Ext....

    解决datefield组件 日期选择框在IE8下显示不完整的问题

    extjs中,经常会用到datefield组件控制用户对日期的操作,比如日志管理,需要开始时间、结束时间,但是IE8下日期选择框会显示不全,解决方法参加代码。 同时改代码解决了开始时间、结束时间的时间范围控制的问题,即...

    Flex实现自定义中文日期选择(mx:DateField)

    为了实现自定义的中文日期选择,我们需要做的是扩展DateField类并覆盖其内部的一些关键方法。我们可以创建一个新的MXML组件,继承自DateField,并重写以下部分: 1. **dateFormatter**:这是负责日期格式化和解析的...

    spark datefield datechooser

    通常,这样的博客会包含代码示例,解释如何创建、配置和使用DateField和DateChooser,以及它们在实际项目中的应用场景。 在标签中,“源码”意味着讨论可能深入到软件的内部实现,读者可能会了解到如何查看和理解...

Global site tag (gtag.js) - Google Analytics