Home Tutorial Flex Flex-components Flex DateChooser


Share on Google+Share on Google+
Flex DateChooser
Posted on: April 1, 2010 at 12:00 AM
In this tutorial you can see how to create DateChooser in flex. we can illustrate how to use date or calendar in flex.

Flex DateChooser Controls:-

 DataChooserv is a flex controls and that controls provide the simple process to use calendar in flex.  DateChooser controls display the name of the year, month and a grid of the days of the month. It is provide a calendar used in the flex application. User can use DateChooser controls to display the year, months and name of the days in the calendar form. In this tutorial we can discuss how to create a DateChooser in flex . The example are given below to describe how to create DateChooser in flex.


<?xml version="1.0"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">



import mx.events.CalendarLayoutChangeEvent;

private function selectDate(event:CalendarLayoutChangeEvent):void {

if (event.currentTarget.selectedDate == null) {



date.text=(event.currentTarget.selectedDate.getMonth() + 1) +

"/" + (event.currentTarget.selectedDate.getDate() +

"/" + event.currentTarget.selectedDate.getFullYear());




<mx:Panel width="400" height="400">


<mx:FormItem label="Date :">

<mx:TextInput id="date" width="100"/>

<mx:DateChooser id="datechooser" change="selectDate(event)"/>





In this example, the Datechooser created and set id of this control and add event listener on the change property. Event are pass in this listener that can handle  through CalendarLayoutChangeEvent objects. and get the current target selected date to display full date in the text box. the output of this example is,


we can see output the selected date in text box.


Related Tags for Flex DateChooser:

Follow us on Twitter, or add us on Facebook or Google Plus to keep you updated with the recent trends of Java and other open source platforms.

Posted on: April 1, 2010

Recommend the tutorial

Advertisements Advertisements