Calendar Color Card

The Calendar Control is designed to allow users to view event schedules and seamlessly navigate through weeks, months, and years within an application.

Expected output:

1st Step

  1. Begin by adding a blank transaction form.

2nd Step

  1. Add the Calendar Control to your system, specifying the database field name and label for the Calendar. Adjust the calendar's width to fit your layout. Set the Date Mapping Field to the attribute (e.g., Date) that holds the date value from the API, ensuring data is displayed on the correct date.

3rd Step

  1. Configure the API Data: Including your Data Connection, Models, API URL, Parameters, and any other required fields necessary for data retrieval.

4th Step

  1. Configure Field and Calendar Mapping: Map the fields in the card (e.g., JobTitle) to align with the data from the API, ensuring proper field recognition. Select Card Type as Calendar Color Card and configure settings for border color and tags, enabling dynamic color assignment from the API, as shown in the screenshot.
  2. API Response:

5th Step

  1. Configure the Action: If you need to perform any actions related to the card, such as editing,selecting, etc., you can configure these actions here.

6th Step

  1. Configure Advanced Settings: If you need to configure advanced options such as custom Calendar design you can do. Otherwise, the basic Calendar configuration is complete, and you can start using it.

Final Output: