AS3 Date Range Picker is a component to select a date range using a visual calendar. The component renders two textfields, each one containing a date icon. The user can input the date using the textfield directly or by clicking any of the icons.

When the date icon is clicked a small dialog containing two side by side calendars are presented. On the left calendar the user can choose the beginning of the date range, on the right it’s possible to select the end of the range. The days within the range are highlighted with a different color.

Sample

package  
{
import flash.display.Sprite;
import nid.events.CalendarEvent;
import nid.ui.controls.DateRangePicker;
/**
 * ...
 * @author Nidin P Vinayakan
 */
public class DateRangePickerDemo extends Sprite
{
	private var dateRangePicker:DateRangePicker;

	public function DateRangePickerDemo() {
		dateRangePicker = new DateRangePicker();
		dateRangePicker.dateFormat = "M/D/Y";
		dateRangePicker.x = 20
		dateRangePicker.y = 20
		dateRangePicker.startDate = new Date(2012, 11, 15);
		dateRangePicker.endDate = new Date();
		dateRangePicker.addEventListener(CalendarEvent.DATE_RANGE_CHANGE, onDateRangeChange);
		dateRangePicker.addEventListener(CalendarEvent.APPLY, onApply);
		addChild(dateRangePicker);
	}

	private function onApply(e:CalendarEvent):void {
		trace(e.selectedDateRange);
		trace("Start Date:" + dateRangePicker.startDate);
		trace("End Date:" + dateRangePicker.endDate);
	}

	private function onDateRangeChange(e:CalendarEvent):void {
		trace(e.selectedDateRange);
		trace("Start Date:" + dateRangePicker.startDate);
		trace("End Date:" + dateRangePicker.endDate);
	}	
}
}