When a user clicks on any day within a DateChooser controller and you want to automatically select every day for that week, you can use the selectedRanges property of the control. This is easy adaptable to selecting months or any custom range.
private static const millisecondsPerMinute:int = 1000 * 60;
private static const millisecondsPerHour:int = 1000 * 60 * 60;
private static const millisecondsPerDay:int = 1000 * 60 * 60 * 24;
<mx:DateChooser id="calendar" x="0.5" y="76" width="205"
showToday="false"
enabled="false"
change="calendarClickHandler(event)" />
private function calendarClickHandler(event:CalendarLayoutChangeEvent):void
{
var selectedRanges:Array = new Array();
var selectRange:Object = new Object();
var rangeStart:Date = new Date(event.newDate.getTime() - (millisecondsPerDay * event.newDate.day));
var rangeEnd:Date = new Date(rangeStart.getTime() + (millisecondsPerDay * 6));
selectRange.rangeStart = rangeStart;
selectRange.rangeEnd = rangeEnd;
selectedRanges.push(selectRange);
calendar.selectedRanges = selectedRanges;
}
3 Responses for "Selecting weeks in Flex DateChooser control"
good stuff man, worked great
Thanks for the good example. Works good, but when calendar.firstDayOfWeekn is different that 0, the calculation is wrong. With this reason i have added small chnages:
var screen_offset:int = event.currentTarget.firstDayOfWeek as int;
var rangeStart:Date = new Date(chooser.selectedDate.getTime() – (millisecondsPerDay * chooser.selectedDate.day) + (millisecondsPerDay * screen_offset));
Now the calculation is right in any case.
Thanks again.
Nice work!
I’ve also created a similar component that allows you to select a week by clicking an arrow and you can also select the month – http://blog.flexdevelopers.com/2010/07/flex-datechooser-with-selectable-week.html
Leave a reply