DateField Problem

Question

When I add a date formatter to the DateField control,
selectedDate does not get set. It remains at null after using the
date chooser.
Does anyone know a way I can set selectedDate or is there a
problem with the way I've used the DateFormatter?
The following code shows the error. (The error disappears if
you remove the labelFunction line.)
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="
http://www.adobe.com/2006/mxml"
xmlns="*" creationComplete = "initApp()">
<mx:Script>
<![CDATA[
import mx.controls.DateField;
import mx.formatters.DateFormatter;
public function initApp():void{
var myDF:DateField = new DateField();
myDF.labelFunction = formatDate;
pan.addChild(myDF);
private function formatDate(date:Date):String{
var df:DateFormatter = new DateFormatter();
df.formatString = "D MMM YYYY";
return df.format(date);
]]>
</mx:Script>
<mx:Panel id="pan" width="450" height="150" />
</mx:Application>
Doug

Answer 1

This solves the problem.
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="
http://www.adobe.com/2006/mxml"
xmlns="*" creationComplete = "initApp()">
<mx:Script>
<![CDATA[
import mx.controls.DateField;
import mx.formatters.DateFormatter;
import mx.events.DropdownEvent;
private var dc:Date;
public function initApp():void{
var myDF:DateField = new DateField();
myDF.labelFunction = formatDate;
myDF.addEventListener(DropdownEvent.OPEN, calOpenHandler);
myDF.addEventListener(DropdownEvent.CLOSE, calCloseHandler);
pan.addChild(myDF);
private function calOpenHandler(event:DropdownEvent):void{
event.currentTarget.selectedDate = dc;
private function calCloseHandler(event:DropdownEvent):void{
if(dc == event.currentTarget.selectedDate){
event.currentTarget.selectedDate = null;
}else{
dc = event.currentTarget.selectedDate;
private function formatDate(date:Date):String{
var df:DateFormatter = new DateFormatter();
df.formatString = "D MMM YYYY";
return df.format(date);
]]>
</mx:Script>
<mx:Panel id="pan" width="450" height="150" />
</mx:Application>
Doug