Question

我尝试创建一个可编辑的日期字段itemrenderer。

如果单击日历按钮，此itemrenderer工作正常。但是如果我用键盘放数据，数据不会更新，如果字段是焦点，则数据变空。

见下面我的代码

Datagrid列就像那样

    <mx:DataGridColumn dataField="echDate"  
       headerText="Date" headerStyleName="dgHeader"
itemEditor="ui.itemRenderer.irDateD" editorDataField="dateModif"/>

和项目编辑器

    <?xml version="1.0" encoding="utf-8"?>
<s:MXDataGridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
                          xmlns:s="library://ns.adobe.com/flex/spark" 
                          xmlns:mx="library://ns.adobe.com/flex/mx" 
                          focusEnabled="true">

    <fx:Script>
        <![CDATA[


            import mx.controls.dataGridClasses.DataGridListData;
            import mx.controls.listClasses.BaseListData;
            import mx.events.CalendarLayoutChangeEvent;
            import mx.events.FlexEvent;

            [Bindable] public var dateModif:String;


            override public function set data(value:Object):void{
                if(listData){
                    var newDate:Date;
                    var value1 = value.echDate;

                    if (value1 is String){
                        newDate = new DateUtility().dateStringToObject2(value1);
                        super.data = newDate;
                        dfDG.selectedDate = newDate;
                        dfDG.text = value1;

                    } 
                    else if (value1 is Date){
                        super.data = value as Date;
                        dfDG.selectedDate = value1 as Date;
                        dfDG.text = new DateUtility().DateAsToString(value1);
                    }
                }        
            }



            protected function dfDG_changeHandler(event:CalendarLayoutChangeEvent):void
            {
                dateModif=dfDG.text;
            }

        ]]>
    </fx:Script>


    <mx:DateField id="dfDG"
                  editable="true"
                  formatString="DD/MM/YYYY"
                  yearNavigationEnabled="true"
                  width="95"
                  change="dfDG_changeHandler(event)"
                  >

    </mx:DateField>
</s:MXDataGridItemRenderer>

如果有人能帮助我解决这个问题，我会很高兴的

Answer 1

您可以尝试此解决方案。

如果数据已更新，我已插入第二个DG以便您查看。

我没有你的DateUtility（）。dateStringToObject2（value1），这就是我使用Validator的原因。

Renderer和App之间的“反向连接”是通过Binding实现的。当您使用DateUtility（）来更正输入时，您可以将结果插入DateField的text属性。

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
           xmlns:s="library://ns.adobe.com/flex/spark" 
           xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">

<fx:Declarations>
    <fx:Model id="cells">
        <dataset>
            <data>
                <name>a</name>
                <echDate>14/01/2013</echDate>
            </data>
            <data>
                <name>b</name>
                <echDate>15/01/2013</echDate>
            </data>
        </dataset>
    </fx:Model>
</fx:Declarations>

<s:VGroup>

<mx:DataGrid 
    width="386" height="100" dataProvider="{cells.data}" 
    alternatingItemColors="[0xffffff]"
    horizontalGridLineColor="0x999999" 
    horizontalGridLines="true"
    verticalGridLineColor="0x999999" 
    sortableColumns="false" 
    resizableColumns="false" selectable="false">

    <mx:columns>
        <mx:DataGridColumn dataField="name" headerText="Name"/>
        <mx:DataGridColumn dataField="echDate" headerText="Date"
       itemRenderer="com.dgdatefield.irDateD"/>
    </mx:columns>
</mx:DataGrid>

<mx:DataGrid 
    width="386" height="100" 
    dataProvider="{cells.data}">

    <mx:columns>
        <mx:DataGridColumn dataField="name" headerText="Name"/>
        <mx:DataGridColumn dataField="echDate" headerText="Date"/>
    </mx:columns>

</mx:DataGrid>

</s:VGroup>

</s:Application>

//渲染

<?xml version="1.0" encoding="utf-8"?>
<s:MXDataGridItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009" 
                      xmlns:s="library://ns.adobe.com/flex/spark" 
                      xmlns:mx="library://ns.adobe.com/flex/mx" 
                      focusEnabled="true">
<fx:Declarations>
    <mx:DateValidator 
        id="dateValidator"
        source="{dfDG}" 
        property="text" 
        inputFormat="DD/MM/YYYY"
        wrongLengthError="The date format is not correct"
        allowedFormatChars="/ - ."/>
</fx:Declarations>

<fx:Binding source="dfDG.text" destination="data.echDate"/>

<s:HGroup width="100%" horizontalAlign="center">
    <mx:DateField 
          id="dfDG" text="{data.echDate}"
          editable="true"
          formatString="DD/MM/YYYY"
          yearNavigationEnabled="true"
          width="120"/>
</s:HGroup>

</s:MXDataGridItemRenderer>

我希望它可以帮到你

datefield itemrenderer

1 个答案: