APEX 4.0 introduced native support for the jQuery UI Date Picker. When you create a date item in APEX you now have the option to set a Minimum and Maximum date as shown below. The catch is that those dates restrictions are defined when the page is rendered and aren't updated in real time. This is an issue if you want those constraints to dynamically change based on user input.

Date Picker Settings

In some cases you'll need the min and max dates to change dynamically. A classic example is when you book a plane ticket and set your departure and return dates. When you select a departure date then select a return date, the return date can't be before the departure date. Dates before the departure date are usually greyed out. Using APEX you could try to implement this example by doing the following:

• Create a Date Item, P1_DEPT_DATE. Set the Maxium Date to be &P1_RETURN_DATE.
• Create a Date Item, P1_RETURN_DATE. Set the Mininum Date to be &P1_DEPT_DATE.

Run the page and select a date for the Departure Date (in this example 24-Nov-11). Next, select a Return Date. You'll notice that the calendar picker does not prevent you from selecting a return date before 24-Nov-2011.

Note: If you submit the page now it'll raise an exception since the Min and Max attributes requires the date to be in YYYYMMDDHH24MI format. 

So how do you have the min and max date restrictions change based on the user input? Excellent question. My next post introduces a plugin that resolves this issue.