NlsCalendar Professional
Stay Top, Double Click to Select
NlsCalendar Professional - Advanced Calendar Control

This example use double click to select date. With autoUpdate option on, click on the calendar will updates the selected date in the input box. You can also close the calendar using Select button. If autoUpdate option is off, the selected date will be updated to input box when Select button is clicked

Click on the "Pick" button to shows the calendar.


  • The example above returns date with format 'day in week, month date, year [hours:minutes]'.
  • Time selector is enabled.
  • The calendar mode is floating (0) which is the default mode.
  • autoUpdate is on, any date selection will updates the input box.
  • Cancel button is disabled.
  • Double click to close or click on Select button to close.

Example code:

                //creates the calendar.
                  var cal=new AOCalendar("cal1");
                  cal.opt.dtFormat="$DW, $MM $dd, $YY [$HH:$mi]";