Main page

Calendar with Date Selection


This example shows how to build a Calendar with date selection.

Steps to recreate

  1. Use the Calendar Builder to create the Calendar based on the user_events table.
  2. Remove the EventDescription label.
  3. Add Link DayNumberLink near label DayNumber and select Special Value in the Control Source Type property, CurrentProcessingDate in Control Source, Date in Data Type and enter d in the Format property. Then open the 'Href Source' window by clicking on the [...] button next to the Href Source property.
  4. Use the Grid Builder to create grid priorities_user_events (based on the user_events and priorities tables of database Intranet).
  5. For Label user_event_time set the Format property to ShortTime.
  6. Add the Hide-Show components Action to Before Show event of Grid.
    Also set the Action property to Hide, Condition Type property to Parameter, Compare As property to Text, Condition property to Equal.
    Also for 'Parameter1' set the Name property to s_date, Source Type property to URL.
    For 'Parameter2' set the Name property to "" and Source Type property to Expression.
  7. Add the appropriate programming code in the event as shown in the example.
  8. Make cosmetic changes as needed by modifying the text and captions within the HTML.

Database Tables Used

Database: IntranetDB

Tables: user_events, priorities

Programming Notes

The Calendar Before Show Day event is used to specify the style for the selected date and show link instead the link if there are events for this day.

The Page Before Show event is used to specify the default date for the Calendar.