Flex Examples
The following examples show how you can set a minimum and maximum allowable year in the Flex DateChooser control by setting the minYear and maxYear properties.
Full code after the jump.
The following example sets the maximum year to the current year, preventing you from using the month-based or year-based navigation to advance to future years (but future months within the same year are allowed):
<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/05/04/setting-a-minimum-and-maximum-allowable-year-in-the-datechooser-control-in-flex/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical"
verticalAlign="middle"
backgroundColor="white">
<mx:DateChooser id="dateChooser"
yearNavigationEnabled="true"
initialize="dateChooser.maxYear = new Date().fullYear;" />
</mx:Application>
View source is enabled in the following example.
The following example sets the minimum year to the current year, preventing you from using the month-based or year-based navigation to advance to previous years (but previous months within the same year are allowed). Also, a disabled range is set up using the disabledRanges property which specifies a rangeEnd value of the current date, preventing users from selecting any days prior to today:
<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/05/04/setting-a-minimum-and-maximum-allowable-year-in-the-datechooser-control-in-flex/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
layout="vertical"
verticalAlign="middle"
backgroundColor="white">
<mx:DateChooser id="dateChooser"
yearNavigationEnabled="true"
initialize="dateChooser.minYear = new Date().fullYear;"
disabledRanges="{[{rangeEnd:new Date()}]}" />
</mx:Application>
View source is enabled in the following example.
Peter deHaan
Peter deHaan currently works for Adobe on the Flex SDK QA team. While not working on Flex, Flash, and ColdFusion applications, Peter enjoys making up bios and writing in 3rd person. Peter's rarely updated blog can be found at blogs.adobe.com/pdehaan/, actionscriptexamples.com, airexamples.com, and coldfusionexamples.com.
Share
Your statement, “Also, a disabled range is set up using the disabledRanges property which specifies a rangeEnd value of the current date, preventing users from selecting any days PRIOR to today” is incorrect. Instead, users are prevented from selecting any days PRIOR to today PLUS TODAY. How would you make the exclusion begin yesterday going backward (or tomorrow going forward)?
Thanks,
Jim
Jim Jones,
Instead of using
new Date(), which returns the current date/time, try something like the following:var today:Date = new Date(); var yesterday:Date = new Date(today.fullYear, today.month, today.date-1); dateChooser.disabledRanges = [{rangeEnd:yesterday}];Peter
Is it possible to restrict even the month field?
Though the dates are restricted, we are able to navigate through these months??
Thanks Peter for the quick’n’ dirty workaround to the “today” problem of disabledRanges. Code works like a charm!
AD
I’m also interested in whether it’s possible to restrict the month field? would you be able to point out how to do this?