Calendar
5 minutes to readA Calendar DataPart shows records from a table or view as events on an interactive calendar. App users switch between calendar views, move or resize events by drag and drop, and open App Pages to create or update events.
It fits scheduling, bookings, shift planning, and event tracking.
Create a Calendar
Creating a Calendar takes one step in the wizard. You select a data source and map three fields. After you save, you configure the Calendar in the right panel.
- In the left navigation, select Designer.
- Select the App Page where you want the Calendar.
- Select Add elements.
- In the elements panel, select Calendar under Reports section.
- Under Data source, select a table or view. Use the search box to find it, or browse Tables & views in application and Other tables & views.
- In the Select fields step, drag a field from Available fields into each required drop zone:
- Start accepts a Date/Time field.
- End accepts a Date/Time field.
- Title accepts the field that names each event.
- Select Save.
You must map all three fields before you can save.
Configuring additional options for a Calendar
After creating a Calendar, in the right panel, you can configure additional options of the DataPart. The following configurations are available:
DataPart configuration
- Change data source and fields — select this button to change the data source, or to change the fields mapped to Start, End, and Title
- Heading — the heading shown above the Calendar
- Description — the text shown below the heading
- Size — the size of the Calendar on the App Page
Data filters
Select Data filters to set up criteria for DataPart filtering. Learn more.
Interactive controls
In this section, you can enable additional actions for app users. Depending on the place on your DataPart where you want the controls to appear, you can add the following types of interactive controls:
- Header controls – They are buttons that app users select to go to an AppPage or a URL. They appear in the header area of the Calendar
- Event controls – They let app users work with events directly on the Calendar: open an event to view or edit it, add a new event, or move an event to a different time.
- View/Edit lets app users preview and edit event details on a separate AppPage, either a regular AppPage or an overlay. Select the AppPage that opens when an app user selects an event. The event ID is passed to that AppPage, so a Details Form or Update Form there can filter on it to show only that event.
- Add lets app users create an event by selecting an empty area of the calendar. Select the App Page, regular or overlay, that opens. The selected start and end date and time are passed to it. In views where app users can’t select a duration (Month and Schedule), the start and end default to 8:00 AM to 8:30 AM on the selected day.
- Move with Drag & Drop lets app users drag an event to a new time slot, or drag its edge to change its duration. The new start and end values are saved to the record.
To configure a control to open an AppPage or URL, enter a label for the control and select the action that occurs when the control is clicked. You can choose from the following options:
- Go to AppPage redirects to a specific page in your app. For example, you can:
- add a “Create” header control, giving app users quick access to create new records;
- add an “Edit” record control, redirecting users to a Details/Update Form.
- Go to URL redirects to a custom URL. For example, you can use this option to build navigation between AppPages deployed on your own website.
When either redirection option is used, session parameters are automatically passed between the DataPart and the destination page. For Go to AppPage, you can configure an alternative option to pass query string parameters instead. To learn more, see Communication Between DataParts.
Display
Calendar views
Use the Calendar views toggles to set which views app users can switch between: Day, Week, Month, Year, and Schedule. Use the Default dropdown to set the view the Calendar opens in. App users switch views from a dropdown in the rendered app.
- At least one view must stay on, so you can’t turn off the last enabled view.
- If you turn off the view that is set as the default, another enabled view becomes the default.
- In Day and Week views, the time grid opens at 7:00 AM to 7:00 PM. App users can scroll to hours outside that range. Support for changing the visible range is planned for a future release.
Event colors
Turn on Event colors, then select Set colors to assign a color to each value of a field, such as a status or category.
- The event color field can be Text(255), Text(64000), Number, Integer, Currency, Yes/No, or a Formula field that returns one of these types.
- The color list holds up to 20 unique values and can’t be empty. Once you reach 20, the Add button is disabled.
- An empty value counts as its own value, and you can assign it a color.
- You can assign each value only once.
- Events whose value matches no color in the list use the theme’s default event color, set by the
--cas-datapart-calendar-event-colorvariable.
